zoukankan      html  css  js  c++  java
  • Vue v-bind v-model的使用

    v-model 指令在表单控件元素上创建双向数据绑定,所谓双向绑定,指的就是我们在js中的vue实例中的data与其渲染的dom元素上的内容保持一致,两者无论谁被改变,另一方也会相应的更新为相同的数据

    最基础的就是实现一个联动的效果

    <body>
        <div class="app">
            <span>Multiline message is:</span>
            <p>{{message}}</p>
            <br>
            <textarea name="" v-model="message" placeholder="please write..."></textarea>
        </div>
    
    </body>
    <script>
       new Vue({
             el:'.app'
       })
    </script>

    checkbox

    <body>
        <div class="app">
            <input type="checkbox" id="jack" value="jack" v-model="checkedNames">
            <label for="jack">jack</label>
            <input type="checkbox" id="John" value="John"  v-model="checkedNames">
            <label for="jack">John</label>
            <input type="checkbox" id="Mike" value="Mike"  v-model="checkedNames">
            <label for="jack">Mike</label>
            <br>
            <span>Checked names:{{checkedNames}}</span>
        </div>
        
    </body>
    <script>
       new Vue({
             el:'.app',
             data:{
                 checkedNames:[]
             }
       })
    </script>

    v-bind

    有些指令可以在其名称后面带一个“参数” (Argument),中间放一个冒号隔开。例如,v-bind 指令用于响应地更新 HTML 特性

  • 相关阅读:
    DBCC Page查看表和索引数据
    sp_configure
    学习
    OpenRowSet, OpenDataSource
    sp output
    SQL Server中使用CLR调用.NET方法
    SQL Server 2005五个有用的动态管理对象
    SQL显示执行语句信息
    接规则,每三个一组编一个号
    C# winform 与 flash as 的交互通讯
  • 原文地址:https://www.cnblogs.com/hemude7788/p/5939092.html
Copyright © 2011-2022 走看看