v-model是什么?

v-model 就是 vue 的双向绑定的指令,能将页面上控件输入的值同步更新到相关绑定的data属性,也会在更新data绑定属性时候,更新页面上输入控件的值。

双向数据绑定的原理 :

双向数据绑定是通过 数据劫持 结合 发布订阅模式的方式来实现的,也就是说数据和视图同
步,数据发生变化,视图跟着变化,视图变化,数据也随之发生改变。

语法 : v-model='data数据变量'

适用: v-model适用于表单开发,自动获取用户输入或选择数据.


v-model修饰符

语法

v-model.修饰符="vue数据变量"

.lazy 在失去焦点时触发更改而非inupt时

.trim 去除首尾空白字符

.number   以parseFloat转成数字类型


v-model语法糖

v-model的写法简单,一个指令可以实现两个功能: 字传父 和父传子

子传父 : 父组件抛出一个input事件,子组件通过$emit()抛出事件

父传子 : 是将父组件input 的value属性传给子组件,子组件通过porps接收

Logo

前往低代码交流专区

更多推荐