Vue.js 2中如何结合v-for与v-html实现内容渲染？

你尝试的这种方式不可行，原因如下：

v-html仅负责将字符串作为纯HTML渲染，Vue不会对v-html插入的内容进行编译——你拼接的<template v-for='item in datateste'>和{{ item }}这类Vue指令、插值语法，会被当成普通的HTML文本或标签，不会被Vue解析执行，自然无法实现列表渲染。

正确实现方式 #

场景1：仅渲染纯文本列表

直接在模板中使用v-for即可，无需借助v-html：

<template>
  <div>
    <p v-for="item in datateste" :key="item">{{ item }}</p>
  </div>
</template>

<script>
export default {
  data: () => ({
    datateste: ['aa', 'bb']
  })
}
</script>

场景2：列表项包含HTML内容

如果需要渲染带HTML的列表项，可以先处理数据生成对应HTML字符串数组，再通过v-for循环结合v-html渲染每个项：

<template>
  <div>
    <div v-for="(htmlItem, index) in renderedContent" :key="index" v-html="htmlItem"></div>
  </div>
</template>

<script>
export default {
  data: () => ({
    datateste: ['aa', '<b>bb</b>']
  }),
  computed: {
    renderedContent() {
      return this.datateste.map(item => `<p>${item}</p>`);
    }
  }
}
</script>

内容的提问来源于stack exchange，提问作者Luiz Alves