一个重要的内置关系:
VueComponent.prototype.proto === Vue.prototype
为什么要有这个关系?
让组件实例对象(vc)可以访问到 Vue原型上的属性、方法。
在vc的原型对象上__proto__不直接指向object的原型对象,而是强制把vc的__ptoto指向vue的原型对象,因此可以访问到vue原型上的属性和方法
<div id="root">
<school></school>
</div>
<script type="text/javascript">
Vue.prototype.x = 99
//定义school组件
//虽然在school组件上没有关于x的属性,但是在vm里面有,所以可以访问到vue原型上的属性
const school = Vue.extend({
name:'school',
template:`
<div>
<h2>学校名称:{{name}}</h2>
<h2>学校地址:{{address}}</h2>
<button @click="showX">点我输出x</button>
</div>
`,
data(){
return {
name:'尚硅谷',
address:'北京'
}
},
methods: {
showX(){
console.log(this.x)
}
},
})
//创建一个vm
const vm = new Vue({
el:'#root',
data:{
msg:'你好'
},
components:{
school
}
})
</script>