0

我需要 Vue.js 包 v-tooltip ( https://akryum.github.io/v-tooltip/#/ ) 的帮助。

我阅读了文档并查看了网站上的示例，并且我的测试工作完美：

<a
  href="#"
  v-tooltip="{
    content: 'Tooltip Content',
    placement: 'top-center',
    delay: {
      show: 400,
      hide: 400,
    },
  }"
  class="tooltip-link">tooltip special link</a>

现在，在我的站点中，我无法像这个示例那样插入 HTML 标记，但在我的组件中，我得到了一个属性data-content。这个属性是一个包含带有v-tooltip指令的 HTML 标记，所以我用这种方式打印它：

<div class="rte general-typo"v-html="content"></div>

内容是使用 WISIWIG 编辑器创建的，经过修改以添加工具提示元素的自定义标记；我的 vue 组件只是得到这个字符串变量。

此操作的结果是v-tooptip指令未“读取”，并且工具提示不显示。通过检查器，我可以看到两个示例之间的区别：在第一个示例中，我可以看到<a data-v-00f96b30="" href="#" class="tooltip-link has-tooltip" data-original-title="null">tooltip special link</a>(v-tooltip 指令已处理，工具提示已激活)，在第二个示例中，我可以看到<div data-v-00f96b30="" class="rte general-typo"><a href="#" v-tooltip="{content: 'Tooltip Content',placement: 'top-center',delay: {show: 400,hide: 400,},}" class="tooltip-link">tooltip special link</a></div> .

如何“强制”激活我的指令？

4

0 回答 0