关于vue.js:vue自定义组件vmodel

自定义组件ym-set-cols

Vue.component('ym-set-cols',{    template: `    <div v-for="item in tableCols">        <el-checkbox v-model="item.isCheck" :label="item.name" @change="checkChange"></el-checkbox>    </div>`,     data() {        return {            tableCols: []        }     },     model: { // 外围        prop: 'cols', // 接管父组件传值属性        event: 'complete' // 自定义一个事件，用于触发向父组件传值     },     props: {        cols: Array     },     mounted() {        // 讲props进行本地存储        this.tableCols = this.cols.map(item=>item)     },     methods: {        checkChange(item) {            // 扭转值，传给父组件            let temp = this.tableCols.filter(item=>item.isCheck)            this.$emit('complete',temp)        }     }})

父组件调用

<ym-set-cols v-model="tableCols"></ym-set-cols>

v-model语法糖就相当于:cols="tableCols" @complete="changeCols"