Vue组件化原理
我们写的组件实际就是一个options对象
当我们声明完一个组件时候,Vue内部通过extend全局方法继承Vue构造函数生成一个子类,同时会合并options
如果是全局组件注册调用Vue.components,会将组件(我们实际写的组件就是一个options再转化为一个组件类)
转化为一个组件类然后挂载Vue.options.
components,同时vue内部也把Vue构造函数挂载到options._base,方便以后我们局部注册组件拿到extend方法,然后转化为组件类
当我们去使用这个组件的时候,会创建一个组件实例,实例会调用mount方法生成真实的dom,通过el拿到真实的dom然后挂载到页面通过上面所说,为什么组件中data必须是一个函数,防止多个组件实例互相影响
props原理
首先要明白,props是相对组件来说的
生成组件虚拟dom时会增加一个属性叫propsData存放着用户传递的数据
在初始化过程中会进行属性的初始化操作。会用用户编写的props和propsData进行检测(进行检验validateProps)。最终将属性存放到_props上。并使用proxy方法进行代理,将其代理到实例上。
跟React不同的是,React的props是挂载props对象上的,而Vue还要在组件显示声明传递过来的Props,所以这就是为什么要进行检验了
组件通信
父子通信基于Props实现