zoukankan      html  css  js  c++  java
  • vue v-model使用说明

    1、概述

    v-model 会忽略所有表单元素的 valuecheckedselected 特性的初始值而总是将 Vue 实例的数据作为数据来源。你应该通过 JavaScript 在组件的 data 选项中声明初始值。

    2、值绑定

    对于单选按钮,复选框及选择框的选项,v-model 绑定的值通常是静态字符串 (对于复选框也可以是布尔值):

    <!-- 当选中时,`picked` 为字符串 "a" -->
    <input type="radio" v-model="picked" value="a">
    
    <!-- `toggle` 为 true 或 false -->
    <input type="checkbox" v-model="toggle">
    
    <!-- 当选中第一个选项时,`selected` 为字符串 "abc" -->
    <select v-model="selected">
      <option value="abc">ABC</option>
    </select>

    3、修饰符

    (1)lazy

    在默认情况下,v-model 在每次 input 事件触发后将输入框的值与数据进行同步 (除了上述输入法组合文字时)。你可以添加 lazy 修饰符,从而转变为使用 change 事件进行同步:

    <!-- 在“change”时而非“input”时更新 -->
    <input v-model.lazy="msg" >

    (2)trim

    如果要自动过滤用户输入的首尾空白字符,可以给 v-model 添加 trim 修饰符:

    <input v-model.trim="msg">
  • 相关阅读:
    扩展性很好的一个分页存储过程
    SQL中列转行
    Server.MapPath() 方法(摘自互联网)
    容易遗忘のSQL
    Linq读取XML
    字节流和字符流
    Java中" "和 ' '
    Spring常用基本注解
    finally和return
    JS 深度clone
  • 原文地址:https://www.cnblogs.com/mengfangui/p/8931493.html
Copyright © 2011-2022 走看看