Vue自定义组件v-model实现双向数据绑定-Input文本框

1、创建VModelInput组件，代码如下：

<template>
    <input :value="value" @input="$emit('input', $event.target.value)" />
</template>

<script>
    export default {
        props: {
            value: {
                type: String,
                default: ''
            }
        }
    }
</script>

2、引用VModelSelect组件，代码如下：

<template>
    <div>
        {{ modelInputValue }}
        <v-model-input v-model="modelInputValue"></v-model-input>
</div>
</template>

<script>
    import VModelInput from '@/components/VModelInput'
    export default {
        components: {
            VModelInput
        },
        data () {
            return {
                modelInputValue: ''
            }
        }
    }
</script>