vue---一个标签中同时使用v-for和v-if导致报错

最新推荐文章于 2024-05-14 17:00:11 发布

__十七

最新推荐文章于 2024-05-14 17:00:11 发布

阅读量1.4k

点赞数 1

分类专栏： Vue 文章标签： Vue优化 v-for v-if 性能消耗代码重构

本文链接：https://blog.csdn.net/wlijun_0808/article/details/125116604

版权

Vue 专栏收录该内容

59 篇文章 5 订阅

订阅专栏

<el-option v-for="item in baseTableList" :key="item.id"
                  :label="item.tableName + '(' + item.chineseName + ')'" :value="item.id"
                  v-if="editData.id !== item.id">
                </el-option>

当在一个标签中，同时出现v-for和v-if的时候，会极大的消耗性能，并且vue会报错。

修改方式：
新加一层标签，在新标签中加入v-if条件

<el-option v-for="item in baseTableList" :key="item.id" :value="item.id">
                      <span v-if="editData.id !== item.id">{{item.tableName + '(' + item.chineseName + ')'}}</span>
                </el-option>