vue-sonner icon indicating copy to clipboard operation
vue-sonner copied to clipboard

How Pass html to the toast? i want to show UL/LI menu inside the toast

Open beshoo opened this issue 1 year ago • 4 comments

How to Pass html to the toast? I want to show UL/LI menu inside the toast.

beshoo avatar May 21 '23 10:05 beshoo

Use the headless version:

<template>
  <ul>
    <li>Item 1</li>
    <li>Item 2</li>
  </ul>
  <button @click="$emit('closeToast')">Close</button>
</template>
import { toast } from 'vue-sonner'
import MyComponent from './MyComponent.vue'

toast.custom(MyComponent)

wobsoriano avatar Jul 04 '23 17:07 wobsoriano

Yes just like Wobsoriano said but don't forget about markRaw(MyComponent)

sadeghbarati avatar Mar 01 '24 16:03 sadeghbarati

@sadeghbarati this not a nice solution if u just want to "render" html text. For ex: VueSonner is AWESOME currently is rendered as VueSonenr is AWESOME I would like to keep using the "types" with the default style.

ricardo17coelho avatar Mar 11 '24 15:03 ricardo17coelho

any update here ?

ricardo17coelho avatar Mar 27 '24 08:03 ricardo17coelho