vuejs v-for和v-if同时使用报变量未定义

复制代码
[Vue warn]: Property "image" was accessed during render but is not defined on instance. 
    at <App> vue.global.js:1630:17
[Vue warn]: Unhandled error during execution of render function 
    at <App>

Uncaught TypeError: image is undefined

查了下官方文档才找到问题所在

vue3和vue2 v-if和v-for同时使用时渲染优先级变了

vue2中v-for优先级高,同时使用v-if可以直接使用v-for的循环体数据

vue3中v-if优先级高,v-if使用v-for循环体数据时数据还未加载,就报未定义了。

无论时vue2还是3,官方都不建议两者一起使用,建议通过template嵌套

vue3文档:https://cn.vuejs.org/guide/essentials/list.html#v-for-with-v-ifhttps://cn.vuejs.org/guide/essentials/list.html#v-for-with-v-if

vue2文档:风格指南 --- Vue.jsVue.js - The Progressive JavaScript Frameworkhttps://v2.cn.vuejs.org/v2/style-guide/#%E9%81%BF%E5%85%8D-v-if-%E5%92%8C-v-for-%E7%94%A8%E5%9C%A8%E4%B8%80%E8%B5%B7%E5%BF%85%E8%A6%81

相关推荐
Dream-Y.ocean2 小时前
鸿蒙PC平台宅匠 3D 室内设计适配实战:基于 Electron 壳方案的 Three.js 双渲染引擎与参数化户型编辑器开发
javascript·3d·harmonyos
Csvn3 小时前
性能监控
前端
Highcharts.js3 小时前
Highcharts Gantt使用符号的自定义数据标签开发甘特图示例
javascript·甘特图·highcharts·图表开发·实战代码·响应式图表
Csvn3 小时前
构建工具
前端
FRing034 小时前
vue2干货总结3(computed计算属性、watch监听器)
开发语言·前端·vue.js·vue2
Java小卷4 小时前
JuanForm vs FormCreate!Vue3 表单引擎联动配置 PK!
vue.js·低代码
kyriewen6 小时前
Skills 榜前 10 我全装了:只有 3 个能直接用
前端·javascript·程序员
IT_陈寒6 小时前
当Java的hashCode遇上Lombok,我的缓存被全清了
前端·人工智能·后端
工控丫丫7 小时前
帆软看板中经常使用的公式函数及经常搭的组合
前端·javascript·数据库
jerrywus7 小时前
我用 GPT-6.1-sol 做了台会讲解的 3D 售货机:60 罐饮料,一口没喝上
前端·agent·claude