javascript - VueJS v-if json中的json值为true

Question

我的问题是，当我的 JSON 中设置了“more”:true 时，如何在布局中显示“显示文本”

我的布局:

<b-row v-for="?" v-if="?">
    <b-col>
        show text
    </b-col>
</b-row>

我的 JSON:

{
  "array": [
    {
      "id": "1",
      "more": false
    },
    {
      "id": "2",
      "more": true
    }
  ]
}

data () {
  return {
    n: 0,
    array: json
  }
}

编辑:已解决=> v-if="array[0].more"

Answer 1

我从来不喜欢循环条件渲染。

我的偏好是使用计算属性，该属性返回可迭代对象的过滤集。例如

computed: {
  more () {
    return this.array.array.filter(({ more }) => more)
  }
}

然后在您的模板中

<b-row v-for="item in more">
  <b-col>
    show text
  </b-col>
</b-row>