V-MODEL 是VUE 的一个指令，在input 控件上使用时，可以实现双向绑定。

通过看文档，发现他不过是一个语法糖。

实际是通过下面的代码来实现的：

 

<%@ page language="java" contentType="text/html; charset=utf-8"

    pageEncoding="utf-8"%>

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Document</title>

    <script type="text/javascript" src="vue/vue.js"></script>

</head>

<body>

    <div id="app-6">

        <input :value="person.name" @input="person.name = $event.target.value">

        <input :value="person.age" @input="person.age =$event.target.value">

        {{person}}

    </div>

    <script type="text/javascript">

    var app =new  Vue({

        el: '#app-6',

            data:{

                person:{name:"ray",age:19}

            }

    })

    </script>

</body>

</html>

通过绑定绑定INPUT事件来更新对应对象的值。

V-MODEL指令实现方法的更多相关文章

  1. CI中的控制器中要用model中的方法，是统一写在构造器方法中，还是在每一个方法中分别写

    Q: CI中的控制器中要用model中的方法,是统一写在构造器方法中,还是在每一个方法中分别写 A: 建议统一写,CI框架会自动识别已经加载过的类,所以不用担心重复加载的问题 class C_User ...

  2. CakePHP采用model的save方法更新数据所需查询

    采用model的save方法更新数据所需查询 1. 验证时候要确认是update 或者 create,以便使用对应规则 public $validate = array( 'field_name' = ...

  3. controller 和 指令 通讯方法

    在 angular 中我们经常会使用多个 controller 和 指令 他们拥有各自的 $scope , 这就产生了跨$scope调用的问题. 有几种常见的方法来可以使用. 方法一 : 指令 req ...

  4. Xshell同时向多个会话发送指令的方法

    我们平时使用XSHELL.SecureCRT.putty等ssh连接工具连接到远程主机,每次输入指令都是在单一会话窗口,如果有很多台会话,需要同时输入同样的指令,我们就不用一一输入,浪费时间和精力.可 ...

  5. backbone Model调用save方法的时候提交方式

    horizon使用的是backbone框架,但是我们的后台api都是只接收post请求,请求的路径为/api/,根据backbone的官档解释: backbone的model.save方法会判断当前的 ...

  6. Thinkhphp5控制器调用的Model层的方法总结

    控制器器里: <?php /** * Created by PhpStorm. * User: Haima * Date: 2018/7/8 * Time: 15:58 */ namespace ...

  7. C# 使用 X.509 v.3 证书的方法。

    C# 使用 X.509 v.3 证书的方法. public static void Main()    { // The path to the certificate.        string ...

  8. SDI011 读卡器自动发送00A4选择指令 解决方法

    如标题,SDI读卡器会自动发送 004A的应用选择指令 解决方法: 是Certificate Propagation 服务 弄的, 关闭就好了

  9. Django model重写save方法及update踩坑记录

    一个非常实用的小方法 试想一下,Django中如果我们想对保存进数据库的数据做校验,有哪些实现的方法? 我们可以在view中去处理,每当view接收请求,就对提交的数据做校验,校验不通过直接返回错误, ...

  10. tp5 中 model 的查询方法

    实例化模型后调用查询方法,可以写任何想要的查询(推荐) public function select(){ $user = model('User'); $data = $user -> ) - ...

随机推荐

  1. Python 学习随笔1

    在一个列表中,找出重复数组的位置. 比如在列表name = [1, 5, 8, 22, 56, 2, 8, 45, 7, 2, 35, 2, 486, 2, 152, 111, 265, 2, 2]中 ...

  2. android studio卡死问题

    今天重新安装android studio 的时候 建工程的时候尽然卡住了,卡在 第一次卡在了 Refreshing gradle project 第二次卡 gradle:download http:/ ...

  3. x86和x64的区别

    整理了下网上的资料,归类了下,大似表述是这样的:IBM/PC兼容机,也就是Intel的i80x86指令架构,就简称了x86.x86并不是指32位环境,而是指80x86架构,这个架构目前有32位,64位 ...

  4. ubuntu安装（owncloud-docker安装）

    1.源下载地址:http://mirrors.aliyun.com/ubuntu-releases/ ubuntu-16.04-server-amd64.iso 2.在虚拟机上安装完后 (1)查看IP ...

  5. JavaScript对象的chapterIII

    二.DOM对象: DOM (document object model) 文档对象模型,它定义了操作文档对象的接口. DOM 把一份html文档表示为一棵家谱树,使用parent(父), child( ...

  6. 【转】关于 mate viewport属性的具体说明！

    什么是Viewport 手机浏览器是把页面放在一个虚拟的"窗口"(viewport)中,通常这个虚拟的"窗口"(viewport)比屏幕宽,这样就不用把每个网页 ...

  7. 自己常用JS和JQ 函数

    //验证码函数 <button id="send">点击发送验证码</button> <script src="jquery.min.js& ...

  8. JFinal 的初始化

    浅析初始化过程 首先要从 web 容器进行初始化 <?xml version="1.0" encoding="UTF-8"?> <web-ap ...

  9. Python notes

    1. range()函数的使用: a = range(n) # a = range(0,n) b = range(m,n) # b = range(m,n) alist = list(a) # ali ...

  10. 狗汪汪玩转无线电 -- GPS Hacking

    狗汪汪玩转无线电 -- GPS Hacking Kevin2600 · 2015/12/09 10:12 0x00 序 GPS Hacking 在过去几年的安全会议上一直都是很受关注的议题. 但往往因 ...