javascript - vue.js 2中如何在代码中使用vue的模板引擎生成html?

Question

需求: 后端会返回一个各种内容组合的数据到前端。前端需要根据对应的名称生成各种展示样式
例:

{name: 'x', address:{'p': '省名', 'c': '市名', 'd': '区县名称', 's': '具体街道'}, capital: [{'name':'某投资人', 'amount':'投资金额', 'percent': '投资占比', 'vision':'投资愿景'},...]}

上面有三个简单的示例(/业务场景比这个多):

name: 需要直接输出即可, address: 需要按某种格式输出, capital: 需要每个投资人一行. 其中capital.name要增加连接

现代码:

<tr v-for="(val,key,index) in alterBase" :key="index">
  <td class="title-center">{{ index+1 }}</td>
  <td>{{ printChangeItem(key) }}</td>
  <td class="value-column" v-html="printAdapterExpr(key, val)"></td>
</tr>

printChangeItem方法负责将英文键换成中文. printAdapterExpr方法根据不同的键格式化输出html字符串。它只是一个委托方法: 若存在格式化方法(printCapital)调用.不存在直接输出:val

问题：如何在某个格式化方法(printCapital)中使用vue的模板来生成html

Answer 1

printCapital 这里应该调用 vue 的组件吧？比如说 component is。

或者你可以参考 render，比如说 elementui 的 message 支持 vnode

---