本文为博主原创，未经允许不得转载：

<!DOCTYPE html>

<html lang="zh">

<head>

 <script src="https://unpkg.com/vue@2.5.13/dist/vue.js"></script>

    </head>

    <body>

        <div id="example-4">

            <!--用HTML模板做双向数据绑定-->

            {{value}}

            <input type="text" v-model.trim="value" />

            <!--

                其中trim为事件修饰符，去除空格。

                v-model.number修饰符为转换为number格式数据

            -->

        </div>

        <script>

            //vue指令语法 v-指令名字+:+指令的参数=指令的表达式

            new Vue({
　　　　　　　　　　 /* el:用于绑定属性的元素 */

                  el: '#example-4',
　　　　　　　　　　//data 用于定义属性，　　
　　　　　　　　　　data: { value:"liuluwei" } 
　　　　　　　　}) 

　　</script>

 </body> 

</html>

Vue学习二：v-model指令使用方法的更多相关文章

  1. Vue学习五：v-for指令使用方法

    本文为博主原创,未经允许不得转载: <!DOCTYPE html> <html lang="zh"> <head> <meta http- ...

  2. vue学习(二) 三个指令v-cloak v-text v-html

    //style <style> [v-cloak]{ display:none } </style> //html <div id="app"> ...

  3. day 82 Vue学习二之vue结合项目简单使用、this指向问题

    Vue学习二之vue结合项目简单使用.this指向问题   本节目录 一 阶段性项目流程梳理 二 vue切换图片 三 vue中使用ajax 四 vue实现音乐播放器 五 vue的计算属性和监听器 六 ...

  4. day 81 Vue学习二之vue结合项目简单使用、this指向问题

    Vue学习二之vue结合项目简单使用.this指向问题   本节目录 一 阶段性项目流程梳理 二 vue切换图片 三 vue中使用ajax 四 vue实现音乐播放器 五 vue的计算属性和监听器 六 ...

  5. Vue学习之路5-v-model指令

    1. 指令释义 v-model在表单控件或者组件上创建双向绑定,本质上是负责监听用户的输入事件(onchange,onkeyup,onkeydown等,具体是哪个,还请查阅官方底层实现文档)以更新数据 ...

  6. Vue学习之路4-v-bind指令

    1. 定义 1.1 v-bind 指令被用来响应地更新 HTML 属性,其实它是支持一个单一 JavaScript 表达式 (v-for 除外). 2. 语法 2.1 完整语法:<span v- ...

  7. Vue学习系列(三)——基本指令

    前言 在上一篇中,我们已经对组件有了更加进一步的认识,从组件的创建构造器到组件的组成,进而到组件的使用,.从组件的基本使用.组件属性,以及自定义事件实现父子通讯和巧妙运用插槽slot分发内容,进一步的 ...

  8. vue学习-day02（自定义指令，生命周期）

    目录: 1.案例:品牌管理    2.Vue-devtools的两种安装方式    3.过滤器,自定义全局或私有过滤器    4.鼠标按键事件的修饰符    5.自定义全局指令:让文本框获取焦点   ...

  9. Vue学习之路8-v-on指令学习简单事件绑定之属性

    前言 上一篇文章以v-on指令绑定click事件为例介绍了v-on指令的使用方法,本文介绍一下v-on绑定事件的一些属性的使用方法. v-on绑定指令属性 .stop属性 阻止单击事件继续向上传播(简 ...

随机推荐

  1. 【Hbase学习之五】HBase MapReduce

    环境 虚拟机:VMware 10 Linux版本:CentOS-6.5-x86_64 客户端:Xshell4 FTP:Xftp4 jdk8 hadoop-2.6.5 hbase-0.98.12.1-h ...

  2. 类中静态成员变量 && 无法解析的外部符号

    [1]如下代码及编译错误 如标题,不做赘述. [2]原因及解决方案 原因:之所以报如上编译错误,因为静态成员变量未初始化. 解决方案:类中静态成员需要在类外进行初始化.其格式为:类型 类名::静态成员 ...

  3. tiny4412 硬件解码

    今天发现了一个好的资源,上面有三星的一些实例代码.http://git.infradead.org/users/kmpark/public-apps

  4. 初探AngularJs框架（二）

    一.创建Components组件 直接使用AngularCLI即可很方便的创建component组件,使用如下指令: ng g component components/news 这样就会在compo ...

  5. 以太坊ETH中智能合约消耗的Gas、Gas Limit是什么？

    以太坊ETH中智能合约消耗的Gas.Gas Limit是什么? 数字货币交易一般是有交易费的,比特币(BTC)的交易费很容易理解,就是直接支付一定额度的BTC作为手续费.而以太坊(ETH)的交易费表面 ...

  6. 前端框架VUE----webpack打包工具的使用

    在这里我仅仅的是对webpack做个讲解,webpack这个工具非常强大,解决了我们前端很繁琐的一些工具流程繁琐的事情.如果感兴趣的同学,还是看官网吧. 中文链接地址:https://www.webp ...

  7. ui-router .state参数配置

    .state('页面被引用时的变量名',{ template: '<h1>My Contacts</h1>',//被应用时插入的模板,状态被激活时,它的模板会自动插入到父状态对 ...

  8. The Little Prince-12/14

    The Little Prince-12/14 世界上有那么多的玫瑰花,但是只有你们是一直陪伴在我身边,我们相互灌溉. ————世界上有那么多的人,但是只有你们是一直陪伴在我身边,我们相互关心. “在 ...

  9. git学习总结 - 纯命令

    全局安装git: npm intall git -g 查看git版本: git --version 进入目录,初始化git: 若在目录中使用上一个,不在目录中使用下一个. //已有目录: git in ...

  10. SpringMVC之数据绑定

    SpringMVC之数据绑定 #数据绑定:Spring MVC会根据客户端请求参数的不同,将请求信息以一定的方式转换并绑定 到控制器类中的方法参数上. #说明:这里的“以一定的方式”应该指的是什么?过 ...