1. 数据渲染：v-text、v-html（保存了html结构）、{{}}（自动更新）；

2. 控制模块隐藏：v-if：直接不渲染 DOM 元素；

v-show：css 里的 display:none；

3. 渲染循环列表：v-for：

 <ul>

   <li v-for='item in items'>

 </ul>

4. 事件绑定：v-on：可以简写成 @，从 methods 取方法；

5. 属性绑定：v-bind:src，可以简写成 :src；

Vue.js 模板指令的更多相关文章

  1. vue.js自定义指令入门

    Vue.js 允许你注册自定义指令,实质上是让你教 Vue 一些新技巧:怎样将数据的变化映射到 DOM 的行为.你可以使用Vue.directive(id, definition)的方法传入指令id和 ...

  2. 02: vue.js常用指令

    目录:Vue其他篇 01: vue.js安装 02: vue.js常用指令 目录: 1.1 vuejs简介 1.2 选择器:根据id.class等查找 1.3 静态绑定数据 data 1.4 插值 { ...

  3. Vue.js 模板语法

    本章节将详细介绍 Vue.js 模板语法,如果对 HTML +Css +JavaScript 有一定的了解,学习起来将信手拈来. Vue.js 使用了基于 HTML 的模版语法,允许开发者声明式地将 ...

  4. Vue - vue.js 常用指令

    Vue - vue.js 常用指令 目录: 一. vuejs模板语法之常用指令 1. 常用指令: v-html 2. 常用指令: v-text 3. 常用指令: v-for 4. 常用指令: v-if ...

  5. Vue.js模板语法介绍

    Vue.js模板.指令 模板语法概述 1.如何理解前端渲染? ​ 把数据填充到HTML标签中,一般我们使用Ajax将数据从后台查询出,结合模板() 2.前端渲染方式 2.1.原生js拼接字符串 ​ 使 ...

  6. Vue.js自定义指令的用法与实例

    市面上大多数关于Vue.js自定义指令的文章都在讲语法,很少讲实际的应用场景和用例,以致于即便明白了怎么写,也不知道怎么用.本文不讲语法,就讲自定义指令的用法. 自定义指令是用来操作DOM的.尽管Vu ...

  7. vue.js常用指令

    本文摘自:http://www.cnblogs.com/rik28/p/6024425.html Vue.js的常用指令 上面用到的v-model是Vue.js常用的一个指令,那么指令是什么呢? Vu ...

  8. 【Vue】vue.js常用指令

    http://www.cnblogs.com/rik28/p/6024425.html Vue.js的指令是以v-开头的,它们作用于HTML元素,指令提供了一些特殊的特性,将指令绑定在元素上时,指令会 ...

  9. 第六篇:vue.js模板语法(,属性,指令,参数)

    Vue.js 的核心是一个允许你采用简洁的模板语法来声明式的将数据渲染进 DOM 的系统. 结合响应系统,在应用状态改变时, Vue 能够智能地计算出重新渲染组件的最小代价并应用到 DOM 操作上.( ...

随机推荐

  1. Open Source CRM

    https://www.odoo.com/zh_CN/page/crm 试用: https://none53.odoo.com/web#home https://none.mypscloud.com/ ...

  2. WIN10护眼色

    参看文章:http://www.xitongcheng.com/jiaocheng/win10_article_10326.html WIN10:[HKEY_CURRENT_USER\Control ...

  3. redis演练

    如何查看所有的key:keys * 如何查询某个key的value:get keyname

  4. linux的LNMP架构介绍、MySQL安装、PHP安装

    LNMP架构介绍 和LAMP唯一不同的是,LNMP中的N指的是Nginx(类似于Apache的一种web服务软件).目前这种环境的应用也非常多.Nginx设计的初衷是提供一种快速.高效.多并发的Web ...

  5. Python中=、copy、deepcopy

    一.Python中的"=" a = 1 b = 1 c = a print(id(a)) print(id(b)) print(id(c)) #输出为 14070784103734 ...

  6. laravel5 报错419，form 添加crrf_field 后让然失败，本地环境配置问题

    这个是因为laravel自带CSRF验证的问题 解决方法 方法一:去关掉laravel的csrf验证,但这个人不建议,方法也不写出来了. 方法二:把该接口写到api.php上就好了 方法三: 首先在页 ...

  7. caffe训练resume

    MODEL=${EXP}/model/${NET_ID}/pspnet101_VOC2012.caffemodel SNAPSHOT=${EXP}/model/${NET_ID}/train_iter ...

  8. ceph 性能测试

    我在物理机上创建了5台虚拟机,搭建了一个ceph集群,结构如图: 具体的安装步骤参考文档:http://docs.ceph.org.cn/start/ http://www.centoscn.com/ ...

  9. BZOJ3456 城市规划 【生成函数】【FFT】

    题目分析: 容易想到生成函数的构造方法. 令g(n)表示n个点的无向图个数,f(n)表示n个点的无向连通图的个数.式子是显然的. 容易发现式子是卷积的形式,写出生成函数,然后多项式求逆后多项式乘法即可 ...

  10. instanceof判断的对象可以是接口

    instanceof是Java的一个二元操作符(运算符) 用法 boolean result = object instanceof class instanceof通过返回一个布尔值来指出,这个对象 ...