parent 都能夠?qū)崿F(xiàn)訪問父組件的屬性的方法，兩者的區(qū)別在于周偎，如果存在多級子組件陶舞，通過$parent訪問得到的是它最近一級的父組件嗽测，通過root訪問得到的是根組件。
<script src="http://unpkg.com/vue/dist/vue.js"></script>
<div id="app">
<root-obj></root-obj>
</div>
Vue.component('root-obj', {
data() {
return {
msg: '我是子組件'
}
},
template: `<div>
<button @click='getRoot'>子組件</button>
<child-component></child-component>
</div>`,
methods: {
getRoot() {
console.log(this.msg)
console.log(this.$parent.msg)
console.log(this.$root.msg)
}
}
})
Vue.component('child-component', {
data() {
return {
msg: '我是子子組件'
}
},
template: `<div>
<button @click='getRoot'>子子組件</button>
</div>`,
methods: {
getRoot() {
console.log(this.msg)
console.log(this.$parent.msg)
console.log(this.$root.msg)
}
}
})
var Main = {
data() {
return {
msg: '我是父組件'
}
}
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')
