vue计算属性怎么样与for结合使用

Question

<div v-for='item in items'>
      {{reversedMessage}}
</div>

export default{
  computed: {
    reversedMessage: function () {
      return   item.hometeam?"ok":"no"
    }
}

在computed中没有item这个属性，要如何在computed计算items每一项呢？总不能computed也来一个循环吧。

Answer 1

你混用了这个方法啊，你这定义computed的reversedMessage默认为get时候计算，此时的回调函数是绑定了this的，这个时候的this是data，你可以尝试console.log(this)看一下。

我的建议是模板中直接写

<div v-for='item in items'>
      {{item.hometeam?"ok":"no"}}
</div>

Answer 2

楼上是简单的方法，你还可以写个filter嘛，干嘛非跟computed过不去呢？

Answer 3

这里你可以用metthods传参实现,而不是computed,

Answer 4

Vue 过滤器了解一下