vue app 渲染图片是报Cannot read property 'xxxxx' of undefined,但是页面渲染出来了

最新推荐文章于 2023-11-07 11:26:05 发布
最新推荐文章于 2023-11-07 11:26:05 发布
阅读量689 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/HXH_csdn/article/details/104004804
版权

页面上能渲染成功，但是vue仍然警告数据属性undefined，，
因为是异步请求，页面渲染刚开始的时候还没有拿到这个值，所以会报错。你需要在节点上用if判断一下，在有数据的时候再进行渲染。

<img v-if="homeData.qc" :src="main+homeData.qc.qqun" />
HXH_csdn
关注
uniapp - 项目运行/打包编译/分包报错 TypeError: Cannot read property call of undefined，uni-app控制台出现一堆这种报错（详细解决方法）
最新发布
高级前端工程师
05-20 6451
uni-app，TypeError: Cannot read property call of undefined，报错，安卓app，苹果app，微信小程序，移动端，H5网页，手机网站，微信小程序、支付宝小程序，手机app端，nvue，微信小程序分包报错，uniApp小程序平台分包失败怎么办，uniapp运行编译报错解决方案，UniApp移动端网页控制台报错，详细解决办法，清缓存重新编译，热重载，开启压缩代码还是不行怎么办，刷新或者重启一下又好了，过一会又开始报错，vue，分包，小程序分包，支付宝小程序分包
Vue - Syntax Error: TypeError: Cannot read properties of undefined (reading ‘styles‘) 项目运行时报错，详细解决方案
王佳斌
11-07 8286
vue2，SyntaxError:TypeError:Cannotreadpropertiesofundefined(reading'styles')，webpack，npmrunserve，报错怎么办，运行报错，runserve时出现报错如何解决，vue2项目运行报错SyntaxError:TypeError:Cannotreadpropertiesofundefined(reading'styles')，vue2怎么解决npmrunserve时的Cannot
vue 报错：Cannot read property 'xxx' of undefined"，但是页面能渲染上数据
热门推荐
昔人'
10-21 3万+
有时候会遇到给页面绑定数据的时候，可以绑定成功，但vue warn:xxx属性of undefined，，，如果本组件只是绑定简单的数据倒是可以忽略，如果本组件还引入了其他组件或第三方组件，插件，则就渲染不出来，就需要解决了， &lt;template&gt; ... &lt;span&gt;{{data.xxx.xx}}&lt;/span&gt; ... &lt;/tem...
Vue中报错：“TypeError: Cannot read properties of undefined (reading ‘key‘)“
try_hard_more的博客
06-12 1万+
原因：在循环的时候 取key值 没有取到 是undefined
Cannot read properties of undefined (reading ‘key‘)
al877的博客
09-15 8039
Cannot read properties of undefined (reading 'key')
vue3 组合式 API 中 props接收参数报错：TypeError: Cannot read properties of undefined (reading：XXX)
Winsom1的博客
05-19 8403
这是因为在组件加载和渲染过程中，父组件向子组件传递 props 数据是一个异步过程，子组件可能在接收到 props 数据之前就尝试访问它们。在访问 obj.book.cover 之前，你需要确保 cover 属性在对象中存在。在子组件的 props 属性中，你也可以为每个传递的 props 设置默认值，以确保在父组件未传递相关 props 数据时，子组件不会出现报错。在上面的例子中，props.obj 对象的属性引用被转换为响应式对象，可以通过 refs.book.value.cover 访问其值。
解决：[Vue warn]: Error in render: “TypeError: Cannot read properties of undefined (reading ‘matched‘)“
weixin_71403100的博客
05-03 1万+
出错的代码尝试访问一个叫做'matched'的属性，但是该属性所属的对象是undefined，导致抛出了TypeError异常。我是在App组件中使用了router，在main.js中引入和注册router的，检查发现在main.js中引入和注册的是。这个错误表示，App组件在渲染过程中尝试访问一个未定义的属性或方法，例如访问一个空对象的属性或调用一个未定义的函数。在main.js中引入和注册router，如下是正确写法👇。检查代码中是否有未定义变量或者空对象的情况👇。routes，并非router。
vue3.0+element 报Cannot read property ‘prototype‘ of undefined
xiawenyi1234的博客
01-06 1万+
写太多vue2.0项目了，3.0都出来这么长时间了，我还没用过，今天初体验一番。（之前都是听说坑很多，今天也遇到一个） 防止旧版本脚手架影响项目，我先卸载老的 npm uninstall vue-cli -g //或者 yarn global remove vue-cli 直接用最新的脚手架（Vue CLI 3的包名称由 vue-cli 改成了 @vue/cli） 注: Vue CLI 3需要 nodeJs ≥ 8.9 cnpm install -g @vue/cli //yarn global .
vue: Uncaught TypeError: Cannot read property … of undefined
weixin_43877725的博客
09-01 4969
记录使用vue遇到的一个问题：在把获取到的信息渲染到页面上出报异常了 数据 因为业务的需求，里面还有个对象信息 export default { name: "ShopInfo", data() { return { viewForm: { } } } } 获取数据然后进行处理之后 viewForm: { view: 'test', other: .
vue + uniapp Uncaught TypeError: Cannot read property ‘getters‘ of undefined
pz3305636904的博客
08-05 1420
Uncaught TypeError: Cannot read property ‘getters’ of undefined 在迁移 vuex 相关代码时，启动的时候报：Uncaught TypeError: Cannot read property 'getters' of undefined store/index.js文件： import Vue from 'vue' import Vuex from 'vuex' import getters from './getters.js' Vue.
Vue解决浏览找不到数据报错问题Cannot read properties of undefined(reading ‘数据名称‘)“
qq_44766377的博客
11-28 8442
这种问题一般有很多种触发情况 我这讲的是数据确实存在，只是vue没有监听到，虽然可以用 this.$set()解决，但事实我这问题比较特殊，没办法用this.$set() 我拿到数据后要根据数据在数据中添加不同的 img，所以无法用this.$set()添加数据。只能另辟蹊径 我选择的方法是 给要显示数据的地方加一个判断（v-if）,而判断值是由数据处理完成后才会变为 true，这样要显示数据的地方要等到数据处理完成后才能用到数据，这样就避免了报错，影响后面的某些代码运行，比如...
vue中cannot read property of 'xx' undefined 报错的解决方案
weixin_43917792的博客
12-15 8830
无法准备未定义属性 在做一个电影详情页的时候，遇到一个结构稍微复杂的数据结构，如下图 需求是将电影的类型渲染到页面上 渲染部分的代码 <p class="title">{{detail.alt_title | formatTitle}}</p> <p class="grey">{{detail.attrs.mov...
ts报错：TypeError Cannot read properties of undefined (reading ‘key‘)
m0_67401660的博客
03-08 2724
报错如下： 原因：拷贝了注册了组件的代码，然后删除组件的时候， 把整个@Component 删掉了 解决办法： 在export default class 前面加上 @Component @Component export default class AnnualTaxRebateSubsidyView extends Vue { } ...
【vue踩坑记录】Error in render: “TypeError: Cannot read property ‘XXXXXXXXX‘ of null渲染错误问题
费马程序猿的博客
07-19 2290
Error in render: "TypeError: Cannot read property ‘XXXXXXXXX’ of null 渲染错误问题 问题： 搭建项目月计划详情页时，能够完整渲染出月计划数据详情页面无问题，但开发者工具仍然报出“Error in render: "Error in render: “TypeError: Cannot read property ‘monthPlanName’ of null””错误，具体如上三图。 经过一系类测试摸索 怀疑是父组件传递给子组件数据时
js错误：Cannot read property ‘value‘ of null
qq_42867113的博客
10-22 7507
js错误：Cannot read property ‘value’ of null <script type="text/javascript"> function loadPage(){ var targetURL=document.getElementById('url').value;//错误为这行 console.log(targetURL); } loadPage(); </script> <input type="text" id="url"
vue 踩坑记录 cannot read property xxx of undefined
一颗小陨石的博客
01-01 3万+
项目使用了swiper轮播图，本来好好的，但是渲染完数据后 refs.swiperName.refs.swiperName.refs.swiperName.swiper 跟着失效了，渲染的数据地方也报 undefined ，虽然数据可以渲染出来。 原因： 复杂数据接收时需要指定内部结构，因为Vue只能读取其原始的数据结构，后面再加进去的会出问题。 如： goods:[] //要指定内部结构： goods:[ detail:{}, shopList:[] ] swiper没啥事 是因为这个问题间.
在项目渲染图片时，图片已加载出来但继续报错：Error in render: “TypeError: Cannot read property ‘replace‘ of undefined“
Airbro的博客
06-24 387
在写项目时，为了检测是否可以拿到图片时，发现拿得到图片，但一直在报错。经过分析后发现应该是因为在data中我的info最初设置为''导致，问题代码： <div> <header>{{this.topic}}</header> <section > <img :src="info.img | img('192.270')" :alt="this.info.nm"> </section&gt
Uncaught TypeError: Cannot read property 'value' of null
WeLoveSunFlower的专栏
06-10 6859
在 Chrome 中使用document.getElementById("dd"),或者$("dd"); 可能会遇到如上错误，这不是是该语句或写法有问题，而是可能使用了不存在的 id，比如：$("id1")，id1 在 HTML 中根本不存在，则会报如标题中的错误。 要注意，是不是把
关于 Error in render: “TypeError: Cannot read property ‘0‘ of undefined“ 渲染报错问题
weixin_46599638的博客
08-10 313
今天在项目过程中遇到渲染数据报错问题 在商品详情页面中报错 但是数据渲染没有问题 莫名其妙的报错了 这个时候我们百度一下报错信息： 翻译了一下还是有点懵逼 解决方案： 利用销毁显示Dom元素 v-if判断数据是否为null 空的则不显示数据 在开发中经常出现这种问题！！！！！！重点 ...
Vue循环渲染多个相同Echarts图表实现
"在Vue应用中使用循环渲染多个相同ECharts图表的方法，通过v-for指令动态生成图表，并结合ECharts库实现数据绑定和初始化。" 在Vue.js框架中，经常需要根据动态数据来渲染组件，这包括在同一个页面上显示多个相同但...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值