vue中v-for和v-if组合使用问题解决方案
当 v-if 与 v-for 一起使用时，v-for 具有比 v-if 更高的优先级，这意味着 v-if 将分别重复运行于每个 v-for 循环中，将会影响速度，尤其是当之需要渲染很小一部分的时候，所以不推荐v-if和v-for同时使用如果你的目的是有条件地跳过循环的执行，那么可以将 v-if 置于外层元素 (或 <template>)上<template v-if="ok"&g
·
当 v-if 与 v-for 一起使用时，v-for 具有比 v-if 更高的优先级，这意味着 v-if 将分别重复运行于每个 v-for 循环中，将会影响速度，尤其是当之需要渲染很小一部分的时候，所以不推荐v-if和v-for同时使用
- 如果你的目的是有条件地跳过循环的执行，那么可以将
v-if置于外层元素 (或<template>)上
<template v-if="ok">
<li v-for="todo in todos">
{{ todo }}
</li>
</template>
- 替换成computed属性
<li v-for="todo in todosIsComplete">
{{ todo }}
</li>
computed: {
todosIsComplete: function () {
return this.todos.filter(todo =>todo.isComplete)
}
}
前往低代码交流专区
更多推荐
2
0- 0
已为社区贡献1条内容
所有评论(0)