4种vue当中的指令和它的用法
1、v-if:判断是否隐藏
2、v-for:数据循环
3、v-bind:class:绑定一个属性
4、v-model:实现数据双向绑定
这里重点说明一个v-if和v-show的区别:
共同点:都是通过判断绑定数据的true/false来展示的
不同点:v-if只有在判断为true的时候才会对数据进行渲染,如果为false代码删除。除非再次进行数据渲染,v-if才会重新判断。可以说是用法比较倾向于对数据一次操作。
v-show是无论判断是什么都会先对数据进行渲染,只是false的时候对节点进行display:none;的操作。所以再不重新渲染数据的情况下,改变数据的值可以使数据展示或隐藏
4种vue当中的指令和它的用法的更多相关文章
- Vue基础01vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令
自学vue框架,每天记录重要的知识点,与大家分享!有不足之处,希望大家指正. 本篇将讲述:vue的基本示例,vue的双向数据绑定,vue中常见的几种用法,vue相关常见指令 前期学习基础,使用vue. ...
- Vue.js自定义指令的用法与实例
市面上大多数关于Vue.js自定义指令的文章都在讲语法,很少讲实际的应用场景和用例,以致于即便明白了怎么写,也不知道怎么用.本文不讲语法,就讲自定义指令的用法. 自定义指令是用来操作DOM的.尽管Vu ...
- vue的基本指令
1.创建vue对象 <script src="vue.js"></script> var vm = new Vue({ el:"#ap ...
- Vue(九) 自定义指令
前面介绍了许多 Vue 内置的指令,比如 v-if.v-show等,这些丰富的指令能满足我们绝大部分的业务需求,不过在需要一些特殊功能时,我们仍然希望对 DOM 进行底层的操作,这时就要用到自定义指令 ...
- 02: vue.js常用指令
目录:Vue其他篇 01: vue.js安装 02: vue.js常用指令 目录: 1.1 vuejs简介 1.2 选择器:根据id.class等查找 1.3 静态绑定数据 data 1.4 插值 { ...
- vue.js常用指令
本文摘自:http://www.cnblogs.com/rik28/p/6024425.html Vue.js的常用指令 上面用到的v-model是Vue.js常用的一个指令,那么指令是什么呢? Vu ...
- Vue - vue.js 常用指令
Vue - vue.js 常用指令 目录: 一. vuejs模板语法之常用指令 1. 常用指令: v-html 2. 常用指令: v-text 3. 常用指令: v-for 4. 常用指令: v-if ...
- Vue中插槽指令
08.29自我总结 Vue中插槽指令 意义 就是在组件里留着差值方便后续组件内容新增 而且由于插件是写在父级中数据可以直接父级中传输而不需要传子再传父有些情况会减少写代码量 示例 <div id ...
- Vue基础系列(四)——Vue中的指令(上)
写在前面的话: 文章是个人学习过程中的总结,为方便以后回头在学习. 文章中会参考官方文档和其他的一些文章,示例均为亲自编写和实践,若有写的不对的地方欢迎大家和我一起交流. VUE基础系列目录 < ...
随机推荐
- TreeMap、HashMap、LindedHashMap的区别
LinkedHashMap可以保证HashMap集合有序.存入的顺序和取出的顺序一致.TreeMap实现SortMap接口,能够把它保存的记录根据键排序,默认是按键值的升序排序,也可以指定排序的比较器 ...
- 桥接模式下,主机能ping通虚拟机,虚拟机ping不通主机
好像是防火墙阻止了什么东西而导致的无法ping通! 1.打开WIN7防火墙 2.选择高级设置 3.入站规则 4.找到配置文件类型为“公用”的“文件和打印共享(回显请求 – ICMPv4-In)”规则, ...
- AC自动机小记
不知不觉这篇博客已经被我咕咕咕了一个月了. 也许我写过AC自动机的博客,但我也不知道我写没写过 前情回顾之\(kmp\) \(kmp\)用来解决一个模式串匹配一个文本串的问题,其思路是设置失配指针,找 ...
- 转 实例详解Django的 select_related 和 prefetch_related 函数对 QuerySet 查询的优化(三)
这是本系列的最后一篇,主要是select_related() 和 prefetch_related() 的最佳实践. 第一篇在这里 讲例子和select_related() 第二篇在这里 讲prefe ...
- 【翻译】WPF应用程序模块化开发快速入门(使用Prism+MEF)
编译并运行快速入门 需要在VisualStudio 2010上运行此快速入门示例 代码下载:ModularityWithMef.zip 先重新生成解决方案 再按F5运行此示例 说明: 在此快速入门示例 ...
- Web03_JavaScript
案例一:使用JS完成注册页面表单校验 <!DOCTYPE html> <html> <head> <meta charset="UTF-8" ...
- LeetCode.1005-K次取负数组和最大(Maximize Sum Of Array After K Negations)
这是悦乐书的第376次更新,第403篇原创 01 看题和准备 今天介绍的是LeetCode算法题中Easy级别的第237题(顺位题号是1005).给定一个整数数组A,我们必须按以下方式修改数组:我们选 ...
- 17.DRX操作时序
DRX状态转移 OnDuration:监听态,监听并接收PDCCH,也叫激活态 StayActive:保持激活状态(做完业务后,继续监听一段时间和一个非激活定时器时间,或者还有缓存) off:off状 ...
- Dialupass v3.20 汉化绿色版 显示查看拨号上网密码
Dialupass 显示查看拨号上网密码 拨号上网的密码不小心丢了怎么办?这个工具可以帮你!在紧要关头,它会让你体验到它的奇效!有备无患,快收藏这个小东东吧. 这是一款拯救忘记了拨号网络密码的使用者的 ...
- [ASP.NET] 解决点击控件下载文件没有响应的问题
下载文件的方法是使用http响应输出流来实现的,使用到了response.write() 导致下载文件时点击控件出错,没有响应,也获取不了文件 是因为在母版页使用了updatepanel,因此回传时发 ...