Vue.js 什么'；使用Vue向具有嵌套数据的组件发送对象的最佳方式是什么？

假设我有以下数据：

data: function() {
     return {
        a: "hello",
        b: {
          title: this.a + " BOB"
        }
     }
}

当我在组件中传递它时，this.a是未定义的

<component :pass-data="b"></component>

---

如何发送嵌套属性？

您可以使用计算属性

data: function() {
     return {
        a: "hello",
        b: " BOB"
     },
  computed:{
    bComputed: function(){
       return this.a + this.b;
     } 
 }
}

并通过

---

附言：那不是

在“BOB”后面，编译器有问题吗
 调用
data
函数时，
this.a
是
未定义的
，因此
b
数据属性被初始化为
“未定义的BOB”
。您正在将该属性正确地发送到子组件

您应该将
b
设置为计算属性：

computed: {
  b() {
    return { title: this.a + ' BOB' };
  }
}

或者在触发
data
方法后设置
b.title
的值：

data() {
  return {
    a: "hello",
    b: {
      title: ''
    }
  }
},
created() {
  this.b.title = this.a + " BOB";
}

或者，正如@Roy J所提到的，在返回
data
方法之前，您可以按照自己的意愿构建数据对象：

data() {
  let a = "hello";

  return {
    a: a,
    b: {
      title: a + " BOB"
    }
  }
}

由于
data
是一个函数，因此可以在那里组装对象，而不是使用
created
。它不必是一条返回对象文字的语句。@RoyJ很好的建议。OP的例子似乎简化了，所以我不确定他们的实际情况是什么/为什么他们需要参考
这个.a