时间戳

首页 > 解决方案 > 在消息部分使用带有链接的 ant-design-vue 通知

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

问题描述

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

我正在为 Vue 使用 ant 设计

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

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

标签： javascriptvue.jsvuejs2antd

解决方案

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

所以你可以使用vueNodeorfunction(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/poliished-butterfly-z1zf8?file=/src/App.vue

推荐阅读