• 要使自定義的Vue組件支持v-model，需要實(shí)現(xiàn)一個(gè)名為value的prop和一個(gè)名為input的事件。
• 在組件內(nèi)部，將value prop 綁定到組件的內(nèi)部狀態(tài)，然后在對(duì)內(nèi)部狀態(tài)進(jìn)行修改時(shí)觸發(fā)input事件。

自定義UI組件

<template><input :value="value" @input="$emit('input', $event.target.value)" />
</template><script>
export default {name: 'MyInput',props: {value: String}
};
</script>

使用組件

<template><div><my-input v-model="message" /> </div>
</template><script>
import MyInput from './MyInput.vue';export default {components: {MyInput},data() {return {message: ''};}
};
</script>