表单输入绑定 修饰符

简介: 表单输入绑定 修饰符

.lazy

默认情况下,v-model 会在每次 input 事件后更新数据 (IME 拼字阶段的状态例外)。你可以添加 lazy 修饰符来改为在每次 change 事件后更新数据:

<!-- 在 "change" 事件后同步更新而不是 "input" -->
<input v-model.lazy="msg" />

.number

如果你想让用户输入自动转换为数字,你可以在 v-model 后添加 .number 修饰符来管理输入:

<input v-model.number="age" />

如果该值无法被 parseFloat() 处理,那么将返回原始值。

number 修饰符会在输入框有 type="number" 时自动启用。

.trim

如果你想要默认自动去除用户输入内容中两端的空格,你可以在 v-model 后添加 .trim 修饰符:

<input v-model.trim="msg" />

 

相关文章
|
6天前
第39节: Vue3 表单输入绑定及修饰符
第39节: Vue3 表单输入绑定及修饰符
24 0
|
6天前
|
JavaScript
表单输入绑定 值绑定
表单输入绑定 值绑定
|
6天前
|
iOS开发
表单输入绑定 基本用法
表单输入绑定 基本用法
|
6天前
|
JavaScript 前端开发 API
表单输入绑定
表单输入绑定
|
10月前
|
Java Maven 数据安全/隐私保护
一个简单的自定义输入框
今天还是一篇关于自定义View相关的,带来一个大众的,常见的一个输入框,很多的场合下都能遇到,比如验证码,密码框等等,配置了很多常见的属性,可以满足不同场合下的需求,矩形框,圆角框,下划线等等均可满足,长度设置,光标选择,背景选择,均可控制。
|
6月前
element中form表单resetFields()方法重置表单无效
element中form表单resetFields()方法重置表单无效
Element-ui 中对表单(Form)绑定的对象中的对象属性进行校验
Element-ui 中对表单(Form)绑定的对象中的对象属性进行校验
957 0
|
JSON 前端开发 JavaScript
表单提交类型
关于提交表单的属性
75 0
uiu
|
安全
【Svelte】-(6)绑定|input 输入框 / group 复选框绑定 / textarea 输入框 / select 绑定 / contenteditable 属性绑定
【Svelte】-(6)绑定|input 输入框 / group 复选框绑定 / textarea 输入框 / select 绑定 / contenteditable 属性绑定
uiu
241 0
【Svelte】-(6)绑定|input 输入框 / group 复选框绑定 / textarea 输入框 / select 绑定 / contenteditable 属性绑定
|
JavaScript
Vue表单中判断当前行输入框的值与整个表单的输入框的值是否重复(过滤自身数据)
使用Element输入框自带change事件获取到scope.$index以及input框中的值(@change="change(scope,$event)"); 使用forEach遍历整个表单的数据(item是需要遍历的数组,index是数组中元素的下标);
443 0
Vue表单中判断当前行输入框的值与整个表单的输入框的值是否重复(过滤自身数据)