vue中自定义组件如何使用v-model

 这里使用input做个示例，更好的展示自定组件使用v-model

/**
*父组件
*/
<template>
    <div>
        /**
        *需要传递给子组件的value值，
        *否则将无法修改value值
        */
        <Child v-model="value" :parentData="value"/>
        /**
        *等价于
        */
        <Child :parentData="value" @input="input"/>
    </div>
</template>

<script>
imoprt Child from './child';
export default{
    components:{Child},
    data(){
        return {
            value:''
        }
    },
    methods:{
        input(e){
            //console查看value是否动态改变
            console.log(this.value)

            this.value = e //第二种写法则需手动设置value值
        }
    }  
}
</script>

/**
*子组件
*/
<template>
	<view>	
        <input type="text" 
            :value="parentData" 
            confirm-type="search" 
            placeholder="placeholder"
            @input="handleInput($event)"
	    />
	</view>
</template>

<script>
	export default {
		props: {
			parentData: {
				type: String,
				default: ''
			}
		},
		methods: {
			//输入触发将修value值发送给父组件
			handleInput(e) {
				this.$emit('input', e.target.value)
			}
		}
	}
</script>