vue自定义组件上的v-model--2020-01-10

1,子组件通过v-model属性获取父组件的数据

子组件：

 

父组件：

父组件使用：

 

  data () {

    return {

      option:["aaa","bbb","ccc"],

      val:"请输入"

    }

  },

3，[endif]父组件通过v-model模仿 input标签的v-model属性

  

export default {

    props: ['value'],

    data(){

        return {

            newValue:this.value

        }

    },

    methods:{

        change(){

            this.$emit("input", this.newValue);

        }

    },

}

备注;

父组件的v-model值接收子组件中props中的value值

子组件初始化newValue的值为父组件v-model中接收的值

之后子组件不断的改变并发射input事件，送出newValue值

子组件的另一种写法：

父组件：

   getValue(event){

     console.log(event,"接收文本框输入的值");

    }