vue实现v-model父子组件间的双向通信
首先讲清楚有个缺点:父页面若同时使用多个子组件,永远只会只能实现第一个双向驱动,我是新手,还在研究。如果有高手请指教,感谢!
子组件
<script> export default { model: { prop: 'path', event: 'cc' }, props: { label: {type: String, default: '点击'}, path:String, }, methods: { btnChange() { this.$emit('cc', res.data) }, }, } </script>
<template> <div> <el-input :value="path" disabled></el-input> <el-button size="small" type="primary" @click="btnChange">{{label}}</el-button> </div> </template>
父组件
<template> <div> <subinput v-model="form.text"/> </div> </template> <script> import subinput from '@/components/Upload.vue' export default { components: { subinput }, data() { return { activeName: 'first', form: {text:''}, } } } </script>