ant design vue notification

通知提醒框

 

/**
 * 
 * @param {error,success,warning,warn,info,open} type 
 * @param {消息頭} message 
 * @param {消息内容} description 
 * @param {超時時間，默認4.5S，單位：秒} duration 
 */
let openNotification = (type, message, description, duration = 80) => {
    // const key = `open${Date.now()}`;
    notification[type]({
        duration: duration,
        message: message,
        description:
            (h) => {
                return h('p', {
                    domProps: {
                        innerHTML: description
                    },
                })
            },
        // onClose: close,
        // btn: h => {
        //     return h(
        //         'a-button',
        //         {
        //             props: {
        //                 type: 'primary',
        //                 size: 'small',
        //             },
        //             on: {
        //                 click: () => notification.close(key),
        //             },
        //         },
        //         'Confirm',
        //     );
        // },
        // key,
    });
}

 

?

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68

// 展示最新的一条推送消息   showSingleMessage () {     const h = this.$createElement     const that = this     if (!this.noPushMessageList || this.noPushMessageList.length <= 0) {       return     }     const item = that.noPushMessageList[0] || {}     this.$notification.open({       key: this.messagekey,       message: `您有${that.noPushMessageList.length}条新消息`,       duration: 0,       placement: 'bottomRight',       description: h('div', null, [         h('p', null, [h('span', null, `${item.messageTitle},`)]),         h('p', null, [           h('span', null, `${item.messageContent},`),           h(             'a',             {               on: {                 click: () => {                   that.toProjectByItem(item, 1)                 }               }             },             '点击查看'           )         ]),         h('p', null, [           h('span', null, '客户名称 '),           h(             'span',             {               on: {}             },             item.customerName           )         ]),         h('p', null, [h('span', null, item.releaseTime)])       ]),       btn: h => {         return h(           'a-button',           {             props: {               type: 'primary',               size: 'small'             },             on: {               click: async () => {                 that.$notification.close(this.messagekey)                 const index = this.getArrayIndex(this.noPushMessageList, item)                 this.noPushMessageList.splice(index, 1) // 删除当前一条                 that.showSingleMessage()               }             }           },           '下一条'         )       },       // 关闭所有未推送消息弹窗       onClose: () => {         this.$notification.close(this.messagekey)         this.noPushMessageList = []       }     })   },