如何在VueJS中的字符串中插入变量答案

【问题标题】：How to interpolate variable within a string in VueJS如何在VueJS中的字符串中插入变量
【发布时间】：2020-08-20 12:50:26
【问题描述】：

我想在 VueJS 中插入一个包含变量和 html 的字符串。 Vue有选项吗？

组件.vue

<template>
    <div v-html="test1"></div>
</template>


<script>
export default {
  name: 'component',
  data() {
    return {
      test: "test interpolation",
      test1: " <p> some text {{ test }} </p>",
    };
  },
}
</script>

test1 变量中的字符串是在 Http 请求后从 Json 文件中加载的

【问题讨论】：

看看vuejs.org/v2/api/#Vue-compile

标签： json vue.js httprequest string-interpolation

【解决方案1】：

export default {
    data () {
      return {
        rawHtml: "<h1> This is some HTML </h1>",
      }
    },
    render(){
        return(
          <div>
            <div domPropsInnerHTML={this.rawHtml}> </div>
          </div>
        )
      }
}

domPropsInnerHTML 属性执行与 v-html 相同的任务，它将 div 的内容设置为 rawHtml。

Ref for more

More Example

【讨论】：