【Vue】绑定数据出错
<el-form-item label="订阅指标表是否显示索引号">
<el-switch
v-model="config.subscriptionsOption.defaultShowIndex"
on-color="#13ce66"
off-color="#ff4949">
</el-switch>
</el-form-item>
<script>
export default {
data () {
return {
config: [
'subscriptionsOption': {
"defaultShowDay": 10,
"defaultShowIndex": true,
"tableShowOption": {
"statisticsOption": [ ],
"moreOption": [ ],
"otherOption": [ ]
}
}
]
}
}
}
</script>
有观察到能正常改变配置值,但是这个显示 undefined 是怎么回事
10 回复
你的 config 是数组而不是对象,你得用类似 config[0].subscriptionsOption 的方式去访问你的属性
那是因为在渲染之前这条属性不存在 你可以在模板中用v-if判断一下,存在了再渲染出来,就ok了。这样体验不是太好,建议加 loading遮罩,不会显的太突兀。
@maiime 倒不是页面报错,控制台报错,挺烦的
可是我将config类型改成object,也写了v-if,还是报错,,,这错误也是莫名其妙,,,,
@vxhly 对
除了config类型改成object,还有<el-form-item>外面要有<el-form>标签。
专业助攻
前排水果瓜子
没事解决了,给个初始值就好了
了解响应式的原理就不会出这种问题