Vue.js/Weex:无法处理动态文本 ； {{testfontawesome}} 方特先生太棒了{ 字体系列：Fontsome； } 导出默认值{ 数据：（）=>({ testfontawesome: }), }

如何在动态值中显示图标？ 在上面的代码示例中，只有第一行正确显示图标，第二行显示原始值而不是图标。 为什么?

---

您需要将该值绑定为原始html

Vue通过自动对html编码值来保护您免受跨站点脚本（XSS）攻击

正如文档中的警告所指出的，避免使用

v-html

显示用户生成的文本，因为这可能是恶意的

<template>
  <div>
    <text class="fontawesome">&#xf053;</text>
    <text class="fontawesome">{{testfontawesome}}</text>
  </div>
</template>
<style scoped>
  .fontawesome {
    font-family:FontAwesome;
  }
</style>
<script>
    export default {
        data: () => ({
            testfontawesome: "&#xf053;"
        }),
    }
</script>

<text class="fontawesome" v-html="testfontawesome"></text>