Vue组件

组件就是一段代码的替代

//全局注册组件

//组件的事情组件内部解决
Vue.component('组件名',{//  配置项

template:``//模板内容,

data(){return{}},//数据对象

methods:{}//自定义函数

computed:{}//计算属性

watch:{}//监听器

filters:{}//过滤器

poprs//获取组件上的参数

props:['c','d'],  // 可以写成数组
                    props:{
                        c: String,//规定c的数据类型
                        d: Number,
                        e: {
                            type: Array,  // 类型限定
                            //  如果类型是 数组或者是对象的话那么如果设置默认值 记得是一个函数返回值
                            default(){//默认值
                                return [1,2,3]
                            }
                        },
                        f: {
                            type: [ String,Number],
                            required: true // 必填
                        },
                        g:{
                            // 可以自定义一个检测函数  该函数会得到属性传递的值 以返回布尔值来决定是否通过检测
                            validator(val){
                                if(val > 5) return true
                                return false
                            }
                        }
                    },

Provide/inject//跨组件通讯

     //孙组件
 inject:{
           c:'a',  // 从供应的 值当中 检索出  'a' 指定一个key 的值
           d: {
                from:'b'
              },
           e: {
                from :'e', 
                default: '没有e!!  没事' // 缺省值 默认值 如果没有e的供应的时候就显示默认值
              }
        }
    //爷组件
 provide:{
            a:1,
            b:'abc',
            e:'我是eeeee'
         }

 components：{}//局部注册组件

})