Javascript Vue.js“；“按$index跟踪”；，如何单独呈现列表项

直到最近，我还在使用

v-show

在我的Vue实例中一次显示一个数组中的每个元素。我的html有以下行：

{{{{tweet}}}
”

。我的根Vue实例是这样构造的（谢谢！）：

这一切都很好，直到我得到了重复的值。为了处理这些，我用指定的

track by$index

替换了

v-show

。我现在在我的html上有了这个：

{{{tweet}

。问题在于，不是单独呈现每个列表项，而是一次呈现整个列表

至于上面的

rotate

方法，由于我无法执行

track by=“show==$index”

，它现在已经没有用了。据我所知，这是因为Vue无法检测数组长度的变化。如前所述，似乎有一种解决方法，即“用空数组替换项””我做了，但没有用。我不知道我错过了什么

---

这里有两个jsfiddle，带有和

解决方案毕竟相当简单，结果代码更精简。完全取消了

v-for

和

track by$index

指令，而是使用计算属性完成了以下任务：

computed: {
  currentTweet: function () {
    return this.tweets[this.showing]
  }
}

在html文件上，只需添加计算属性

currentTweet

，如您通常所做的那样，添加一个mustache标记，此处解释为：

{{{currentTweet}}

因此，不需要这样做：

<li v-for="tweet in tweets" track-by="$index">{{{ tweet }}}</li>

{{{{tweet}}

JSFIDLE

<li>{{{ currentTweet }}}<li>

<li v-for="tweet in tweets" track-by="$index">{{{ tweet }}}</li>