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

相关推荐
柳杉1 小时前
可视化大屏设计器脚手架:从设计到交付的一站式方案
前端·three.js·数据可视化
铁皮饭盒2 小时前
3行代码搞定页面截图,Bun.WebView真的简单
javascript
kyriewen15 小时前
我手写了一个 EventEmitter,面试官追问了 6 个问题——第 4 个我没答上来
前端·javascript·面试
IT_陈寒15 小时前
Java的Date类又坑了我一次,改用时间戳真香
前端·人工智能·后端
山河木马16 小时前
矩阵专题2-怎么创建视图矩阵(uViewMatrix)
javascript·webgl·计算机图形学
小林攻城狮16 小时前
使用 Transport 节流解决 Vercel AI SDK 流式渲染卡死问题
前端·react.js
前端缘梦16 小时前
告别 TS 运行时类型漏洞!Zod 完整入门实战教程(前端 / 全栈必备)
前端·react.js·全栈
the_answer16 小时前
Webpack vs Vite 深度对比分析
前端·webpack
转转技术团队16 小时前
验证码识别实战:前端不写页面,改训模型了?
前端
MomentYY16 小时前
Temperature:AI 的“脑洞旋钮”
前端·llm·ai编程