问题:在template中使用到某个对象
未定义(不存在)
解决:在data中将personData: {}
定义为 personData: {subject: {}
}
<template>
<div>
<p>姓名:{{ personData.name }}</p>
<p>学科:{{ personData.subject.id }}-{{ personData.subject.name }}</p>
<p>分数:{{ personData.subject.score }}</p>
</div>
</template>
data() {
return {
personData: {}, // 错误用法
personData: { // 正确用法
subject: {}
}
}
}
mounted() {
this.personData = {
name: '张三',
subject: {
id: 1,
name: '语文',
score: 90
}
}
}