1.v-text:用于更新标签包含的文本,作用和{{}}的效果一样。

2.v-html:绑定一些包含html代码的数据在视图上。

3.v-show:用来控制元素的display属性,和显示隐藏有关。v-show指令的取值为true/false,当值为true时直接渲染,当值为false时渲染出来之后带有display:none属性。

4.v-if:控制元素是否被渲染出来。v-if指令的取值为true/false,当值为true时直接渲染,当值为false时直接不渲染。和v-show的区别为:如果需要频繁的切换显示/隐藏的,就用

  v-show,如果运行后不太可能切换显示/隐藏的,就用v-if。

5.v-else:没有对应的值,但是要求前一个兄弟节点必须要使用v-if指令。v-if和v-else只有一个被渲染出来。

6.v-for:实现列表的渲染,可以用于data中存放的是array形式的数据之类。v-for除了可以迭代数组,还可以迭代对象和整数。

7.v-bind:用于动态绑定DOM元素的属性,常见的用法有:<a>标签里边的href属性,<img/>标签的src属性等。

8.v-on:相当于绑定事件的监听器,绑定的事件触发了,可以指定事件的处理函数。例如click事件等。

9.v-model:实现表单控件和数据的双向绑定,是最重要最常用的指令,一般用在表单输入。

10.v-once:特点是只渲染一次,后面元素中的数据再更新变化,都不会重新渲染。

Vue的十个常用指令的更多相关文章

  1. Vue.js之常用指令

    vue常用指令 vue.js官方给自己的定义是数据模板引擎,并给出了一套渲染数据的指令.本文详细介绍vue.js的常用指令. 官网:点我 一.v-text.v-html v-text:用于绑定文本 v ...

  2. 1.Vue.js的常用指令

      Vue.js介绍 Vue.js是当下很火的一个JavaScript MVVM库,它是以数据驱动和组件化的思想构建的.相比于Angular.js,Vue.js提供了更加简洁.更易于理解的API,使得 ...

  3. Vue专题-js常用指令

    vue.js官方给自己的定为是数据模板引擎,并给出了一套渲染数据的指令.本文详细介绍了vue.js的常用指令. vue.js常用指令 Vue.js使用方式及文本插值 Vue.js 使用了基于 HTML ...

  4. vue.js常用指令

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

  5. 【Vue常用指令】

    目录 v-html v-text v-for v-if v-show v-bind v-on v-model 指令修饰符 计算与侦听属性 自定义属性 获取DOM元素 "@ *** Vue.j ...

  6. 移动端Tap与滑屏实战技巧总结以及Vue混合开发自定义指令

    最近在忙混合开发,因交互相对复杂,所以也踩了很多坑.在此做一下总结. 1.tap事件的实际应用 在使用tap事件时,老生常谈的肯定是点透问题,大多情况下,在有滑屏交互的页面时,我们会在根节点阻止默认行 ...

  7. vue.js介绍,常用指令,事件,以及制作简易留言版

    一.vue是什么? 一个mvvm框架(库).和angular类似,比较容易上手.小巧,让我们的代码更加专注于业务逻辑,而不是去关注DOM操作 二.vue和angular之间的区别 vue--简单易学 ...

  8. vue 快速入门、常用指令(1)

    1. vue.js的快速入门使用 1.1 vue.js库的下载 vue.js是目前前端web开发最流行的工具库之一,由尤雨溪在2014年2月发布的. 官方网站 中文:https://cn.vuejs. ...

  9. 02: vue.js常用指令

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

随机推荐

  1. Makefile的常用技术总结

    一.MAKE中的自动变量:    $@: 表示target的名字    $%: 仅当目标是函数库文件中,表示规则中的目标成员名.例如,如果一个目标是"foo.a(bar.o)",那 ...

  2. 【linux+C】神器 vim + 指针相关客串

    前篇回顾 上篇介绍了linux下C编程基本环境配置以及相关工具使用选择. 不过10个大牛9个用vim,那么咱们就来玩vim.linux下玩c就别依靠图形界面.好吧告别Ide,命令行才是c的王道. 本篇 ...

  3. POJ1742(多重部分和问题:模板题)

    Coins Time Limit: 3000MS   Memory Limit: 30000K Total Submissions: 32776   Accepted: 11131 Descripti ...

  4. TModJS:使用tmodjs

    ylbtech-TModJS:使用tmodjs 1.返回顶部 1. 1.安装 npm install -g tmodjs 2.配置 我的模板都放在tpl文件夹中,htmls用于存放模板页面,每一个后缀 ...

  5. OutputDebugString()输出调试的使用

  6. Linux Ctrl+Z的使用方法

    假设你发现前台运行的一个程序需要很长的时间,但是需要干其他的事情,你就可以用 Ctrl-Z ,终止这个程序,然后可以看到系统提示: [1]+ Stopped /root/bin/rsync.sh 然后 ...

  7. 【转载】“error LNK1169: 找到一个或多个多重定义的符号”的解决方法

    c++的小细节的地方 原文地址:https://blog.csdn.net/xiaosu123/article/details/5665729 问题描述如下: 有 三个源文件,A.h.B.cpp.C. ...

  8. CodeForces 1098F. Ж-function

    题目简述:给定字符串$s[1 \dots n](n \leq 2 \times 10^5)$,以及$Q \leq 2 \times 10^5$个询问,每个询问有两个参数$1 \leq l \leq r ...

  9. UVa 1412 Fund Management (预处理+状压DP)

    题意:题意很难说清楚自己看原文,链接:UVa 1412 Fund Management 析:总体来说如果没有超时的话,这个题不是特别难,但是这个题很容易超时,主要是体现在状态转移时,很容易想到状态方程 ...

  10. HDU3433 【时间的二分+DP最优解】

    题意: 有n个人,X个任务A,Y个任务B, 给出每个人做A做B的时间,一个人只能在某个时刻做一个工作, 问最短时间完成所有工作. 思路: 二分n个人用的时间,判断最优条件用DP. 可以二分就是因为时间 ...