Vue2：组件基础(面试)

组件

组件是可复用的 Vue 实例，主要用于开发中 具有相同特征不同数据的模块 把它集成为一个组件供重复利用；把组件当做一种标签使用 ，用一次 它内部的代码就会完整的执行一次，就像是一个函数一样,使用组件就相当于在调用函数 ，实参就相当于组件的属性传值

 

组件基础（面试）

1.全局组件:

所有组件共同的功能(指令,过滤器,组件)

组件的属性不能用大写字母 组件的名字可以用驼峰命名法,但是使用的时候必须用连字符 全局注册的组件使用时不能使用单标签(不会报错,但是只能使用一次 多次使用只显示第一个)

注册的组件不要跟系统标签同名

            Vue.filter("alltool2",function(str){
                return str+"-alltool1"
            })
            Vue.directive("color",function(el,obj){
                el.style.color=obj.value||"red"
            })
            Vue.component("allbox",{
                template:"<div>6666allbox</div>"            
            }

 

 

2.局部组件

只有当前组件的功能(指令,过滤器,组件)

一个vm实例可以有多个局部组件,但是只能供当前vm实例使用

 方法1：

components:{
    （组件名）:{template:``},
},

方法2：

let a1 = {
    template: ``
}
var vm = new Vue({
    el: '#app',
    data: {},
    methods: {},
    components: {
    　　//注册组件
       （组件名）: a1,
    },
}）

方法3：

1、创建一个js文件，将组件内容写入，

2、再导入

import (组件名) from xx.js
var vm = new Vue({
    el: '#app',
    data: {},
    methods: {},
    components: {
    　　//注册组件
       （组件名）,
    },
}）