flashfxp 网站,wordpress 4.3,佛山企业网页制作电话,上海早晨新闻今天本篇为Vue3学习中遇到的v-model相关的记录#xff0c;如有问题欢迎指正 一、在标签上使用v-model
v-model通常在input、select等标签上来实现数据双向绑定
input typetext v-modelusername
原理#xff1a;v-model通过给标签value赋值来实… 本篇为Vue3学习中遇到的v-model相关的记录如有问题欢迎指正 一、在标签上使用v-model
v-model通常在input、select等标签上来实现数据双向绑定
input typetext v-modelusername
原理v-model通过给标签value赋值来实现 数据—页面 的绑定。然后通过绑定input事件实现 页面—数据 的绑定。
input typetext :valueusername inputusername $event.target.value
二、在组件标签上使用v-model
1、使用v-model默认传值
Children v-modelusername/
// 上面的v-model可以拆解为
Children :modelValueusername update:modelValueusername $event
原理在组件上时v-model通过 :modelValue 来进行页面传值然后通过子组件触发 update:modelValue 事件来对所绑定值进行修改
2、使用v-model时指定参数名
Children v-model:usernameusername/
Children :usernameusername update:usernameusername $event/
优点可以自由指定参数名、事件名(update:xx)。并且可以同时绑定多个v-model值
