关于Cannot read property 'bar' of undefined的问题

Question

message是一个空对象，

    var app = new Vue({
      el: '#app',
      data: {
        message: {},
      },

然后在

<input ... v-model="message.foo">这样不会报错

但再深入一层的时候会报错
<input ... v-model="message.foo.bar">

请问这怎么解释?

Answer 1

message是一个空对象,message.foo中foo没初始化，为undefined，undefined是不能取值的，也就是不能message.foo.bar

//可以这么写
message: {foo:{}},