全局注册和局部注册,组件全局注册流程

恩施知识网 情感人生 2023-04-27 147 0

全局注册和局部注册,组件全局注册流程全局注册:

Vue.component()

全局注册和局部注册,组件全局注册流程

必须是字符串:'my-component',凡是有短横线‘-’都必须要单引号或双引号。可以改为驼峰式,即第二个单词开始,首字母大写,myNameIsBoy:

全局注册和局部注册,组件全局注册流程

如果不想模板写在 tempate 选项,也可以只写 id:

全局注册和局部注册,组件全局注册流程

无法高亮,丑陋了点。

Vue.extend()

这种全局注册方法可以没有组件的名字,直接使用构造函数 Comp.

全局注册和局部注册,组件全局注册流程

思路:不管是Vue.component(),还是Vue.extend(),都是把 template 包含的字符串塞进Vue里面,再 new 实例化之。后者是得到一个新的构造函数Comp,并采用$moount 挂载:

{!-- PGC_COLUMN --}

全局注册和局部注册,组件全局注册流程

不采用也行:

全局注册和局部注册,组件全局注册流程

不过Vue3.0 废除 el 选项咯。

局部组件

在实例里添加components,多了一个s,以为组件可以有多个,其他类似的一般也带个s,比如过滤器 filters。

再强调一遍,短横线作为属性必须带引号,'my-component'。

全局注册和局部注册,组件全局注册流程

当父组件没有后备内容的时,就是不使用插槽时候,可以采用简写:

全局注册和局部注册,组件全局注册流程

欢迎关注