在消息部分使用带有链接的 ant-design-vue 通知

Question

我正在尝试添加通知消息的链接，但它总是被解释为字符串

我正在为 Vue 使用 ant design

this.$notification.error({
        message: 'error please contact <href="mailto:test@test.com?subject=test">',
        duration: 15
      });
    });

我尝试了很多方法，但没有任何效果，我还尝试将“消息”变成一个返回 html 字符串的函数，但没有用！

Answer 1

正如文档所说，message类型是string|vueNode |function(h).

所以你可以使用vueNode或function(h)来创建html string.

下面是函数(h)的例子。

     this.$notification.error({
        message: function(h) {
          return h("div", [
            "error please contact",
            h(
              "a",
              {
                attrs: {
                  href: "mailto:test@test.com?subject=test"
                }
              },
              ["link name"]
            )
          ]);
        },
        duration: 15
      });

https://codesandbox.io/s/polished-butterfly-z1zf8?file=/src/App.vue