避免反复造轮子系列之封装带两个按钮的提示框(ant design 3.0+vue+js)

43 阅读1分钟

所用技术ant design 3.0+vue+js


import { notification, Button } from 'ant-design-vue'

const openNotification = () => {
  const key = `open${Date.now()}`
  notification.info({
    message: 111,
    description: 222,
    duration: 10,
    btn: () =>
      h('div', [
        h(
          Button,
          {
            type: 'primary',
            size: 'small',
            onClick: () => {
              notification.close(key)
            }
          },
          {
            default: () => 'Confirm'
          }
        ),
        h(
          Button,
          {
            type: 'default',
            size: 'small',
            style: 'marginLeft:20px',
            onClick: () => {
              notification.close(key)
            }
          },
          {
            default: () => 'cancel'
          }
        )
      ]),
    key
  })
}

const close = () => {
  console.log('Notification was closed. Either the close button was clicked or duration time elapsed.')
}