ant design of vue中提示$notification的自定义vueNode

开箱即用的高质量 Vue 组件 Ant Design of Vue

背景：

根据后端返回来的数组决定$notification通知提醒的内容，并加上样式。

正常写html是可以的，但是前提是要做循环；

原生的createElement是不行的，因为前提是vueNode

很多组件的description配置参数中都有这些param： string | vueNode |function(h) 。第三个参数是否为html？还是某个工具类转的格式？新手不太会用，翻遍文档也没找到相关的说明内容。原需求就是在各种组件的description或类似配置中配置html格式的超链接等

有关于vueNode的相关解答

vuejs.org/v2/guide/re…

this.$notification.error({
  message: '提示',
  description: h => {
    return h('p', null, [
      h(
        'div',
        {
          class: 'test'
        },
        null
      ),
      h(
        'ul',
        {
          class: 'test-ul'
        },
        that.liFn(h, res)
      )
    ])
  },
  style: {
    width: '500px',
    marginLeft: `${335 - 450}px`
  },
  duration: 0
})

li根据数组的长度循环遍历创建li元素

liFn (h, res) {
  // return [
  //   h('li', {}, '文本'),
  //   h('li', {}, '文本')
  // ]

  // 外层
  if (this.type === 'outside') {
    const arr = []

    for (const key in res.msg) {
      arr.push(h('li', {
        class: 'father-li'
      }, key))
      res.msg[key].map(v => {
        arr.push(h('li', {}, v))
      })
    }

    return arr
  }

  const arr = []
  if (res.msg.length) {
    res.msg.map(v => {
      arr.push(h('li', {}, v))
    })
  }
  return arr
}