• v-model详解


    下面三种模式是相同的

    1: 绑定事件对象handle;

    2: 绑定当前文本框事件值;

    3:v-model模式绑定msg值;

    <!DOCTYPE html>
    <html lang="en">
    <head>
      <meta charset="UTF-8">
      <title>Document</title>
    </head>
    <body>
      <div id="app">
        <div>{{msg}}</div>
        <!-- 1 -->
        <input type="text" v-bind:value="msg" v-on:input='handle'>
        <!-- 2 -->
        <input type="text" v-bind:value="msg" v-on:input='msg=$event.target.value'>
        <!-- 3 -->
        <input type="text" v-model='msg'>
      </div>
      <script type="text/javascript" src="js/vue.js"></script>
      <script type="text/javascript">
    
        var vm = new Vue({
          el: '#app',
          data: {
            msg: 'hello'
          },
          methods: {
            handle: function(event){
              // 使用输入域中的最新的数据覆盖原来的数据
              this.msg = event.target.value;
            }
          }
        });
      </script>
    </body>
    </html>
    
    
  • 相关阅读:
    重新格式化部门表
    从不订购的客户
    回文数
    shell中的双括号表达式
    shell中的if语句
    shell
    view的生命周期
    shell中的数学运算
    shell中的expr命令
    shell中的退出状态码
  • 原文地址:https://www.cnblogs.com/apebro/p/12601984.html
Copyright © 2020-2023  润新知