Vuejs2 无法使用属性值初始化Vue.js数据

应该可以直接引用数据值内的属性。 但由于某种原因，在中不起作用。我创建了一个小示例：

作为解决办法，我现在正在做以下工作：

computed: {
    foo() {
        this.whyDoesNotWork = this.message;
    }
},
watch: {
    foo() {}
}

因此，计算函数直接对数据进行变异。非常粗糙，可能是错的。 有人知道仅仅引用属性的初始示例有什么问题吗？

Vue.component（'child'）{
Vue.component('child', {
  props: ['message'],
  data() {
    return {
        whyDoesNotWork: this.message
    }   
  },
  template: '<span>{{ whyDoesNotWork }}</span>'
})

var app = new Vue({
  el: '#app',
  data: {
    hello: {},
    message: 'someting'
  },
  components:['child'],
  template: '<child :message="message"></child>'
})

道具：['message']，
数据（）{
返回{
Whydoesnowork:这条消息
}   
},
模板：“{{whydoesnowork}}”
})
var app=新的Vue({
el:“#应用程序”，
数据：{
你好：{}，
信息：“有点事”
},
组件：['child']，
模板：“”
})

不要对实例属性或回调使用箭头函数，因为箭头函数不会将其绑定到为其定义计算属性的vue实例

---

不要使用arrow函数返回数据（Vue组件上下文会随之丢失）：

data（）{return{whydoesnowork:this.message}}

我自己永远不会注意到它！谢谢！