为什么使用v-html会在v-for循环中引发绑定错误？

Question

这很好用：

<li v-for="post in posts">
  <a v-bind:href="post.url">{{post.title}}</a>
</li>

但如果我将其更改为此（使用v-html而不是模板）：

<li v-for="post in posts">
  <a v-bind:href="post.url" v-html="post.title"/>
</li>

我收到错误：

Property or method "post" is not defined on the instance but referenced during render.

奇怪的是，更改为v-html语法似乎使完全存在post的想法无效，因为错误现在实际上被抛回v-bind:href。我在v-html属性中添加的内容无关紧要 - 无论如何它都会抛出错误，因为v-html的存在似乎消除了post对象，所以现在{{1失败。

Answer 1

Self closing tags are not valid。使用

<li v-for="post in posts">
  <a v-bind:href="post.url" v-html="post.title"></a>
</li>