自定义组件使用v-model 绑定

1.组件上使用 v-model = " bookList"

2.组件中代码:props是对象

Vue.component("ipms",{
    data:function(){
        return {
            name:""
        }
    },
    props:{
        //v-model 默认是将value作为属性传给子组件中 ,故这里用value (如果是对象类型,不需要watch或conputed来监控value,
        // 简单类型的话需要自己去接收值和向父组件发布值)
        value:{
            type:Array,
            default:function(){
                return [];
            }
        },
    },
    methods:{
        add(){
            this.value.push({name:this.name});
        }
    },
    watch:{
        
    },
    computed:{
        
    },

    template:`

                    

                        添加
                    
                    
{{item.name}}
            
`
})

3.组件中代码:props是简单类型,需要自己去接受value,和发布value

Vue.component("ipms",{
    data:function(){
        return {
            name:""
            
        }
    },
    props:{
        value:{
            // type:Array,
            // default:function(){
            //     return [];
            // }
            type:String,
            default:""
            
        },
    },
    created:function(){
        
    },
    methods:{
       
    },
    watch:{
        value:function(newVal){
            this.name = newVal;
        },
        name:function(newVal,oldVal){
            this.$emit('input',newVal);
            this.$emit('change',newVal);
        }
    },
    computed:{
       
    },

    template:`

                    

                        添加
                    
                    
{{item.name}}
            
`
})