vue 取某个对象的值时提示 Cannot read property '0' of undefined解决
看这张图,浪费了我快半个小时,查看所有数据,打断点,折腾了好久才发现问题所在。MD页面明明渲染正常,但是这个错误一直存在,重启也是这样。先说结论:解决办法是渲染时对每层数据进行判断以下是报错代码:html代码:<h1><div...
·
看这张图,浪费了我快半个小时,查看所有数据,打断点,折腾了好久才发现问题所在。MD
页面明明渲染正常,但是这个错误一直存在,重启也是这样。
先说结论:解决办法是渲染时对每层数据进行判断
以下是报错代码:
html代码:
<h1>
<div
class="resume_msg baseBorder resume_notice resume_lang_name"
notice-key="msg"
for-key="name"
for-value="html"
contenteditable="true"
>
{{resumeList.base[0].name}}
</div>
</h1>
下面是resumeList数据:
msg: "查询成功"
resumeContent: {
base: [{name: "龙伟"}, {tel: "176208944"}, {Email: "1762973@qq.com"}, {edu: "shenzhen"}}
下面是js代码:
data() {
return {
resumeList: {},
};
},
watch: {},
methods: {
// 获取简历信息
getResumeInfo() {
this.axios
.post("/getResumeInfo", {
userName: "long"
})
.then(res => {
if (res.data.status == "0") {
this.resumeList = res.data.result.resumeContent;
}
})
.catch(err => {});
}
解决:
一步到位:
直接在html渲染数据的地方加判断v-if="resumeList&&resumeList.base":
<div
class="resume_msg baseBorder resume_notice resume_lang_name"
notice-key="msg"
for-key="name"
for-value="html"
contenteditable="true" v-if="resumeList&&resumeList.base"
>
{{resumeList.base[0].name}}
</div>
那为什么会这样呢
实际在渲染的时候,在读取对象中的某个属性值时,如果不存在这个属性就会报错。
上面的resumeList的base不存在,那么resumeList.base[0].name就会报错,因为你连这个base的key都不存在。
但是,我不是已经取到了正个对象的值了吗,按理说这个base数组也取到了,实际上渲染的过程是一个异步的过程,开始渲染时
resumeList为空,渲染完成后才拿到数据
更多推荐
已为社区贡献27条内容
所有评论(0)