vue 的常用指令以及作用 ·
1、 v-model 多用于表单元素实现双向数据绑定(同 angular 中的 ng-model)
2、 v-for 格式: v-for="字段名 in(of) 数组 json" 循环数组或 json(同 angular 中的ng-repeat),需要注意从 Vue2 开始取消了$index
3、 v-show 显示内容 (同 angular 中的 ng-show)
4、 v-hide 隐藏内容(同 angular 中的 ng-hide)
5、 v-if 显示与隐藏 (dom 元素的删除添加 同 angular 中的 ng-if 默认值为false)
6、 v-else-if 必须和 v-if 连用
7、 v-else 必须和 v-if 连用 不能单独使用 否则报错 模板编译错误
8、 v-bind 动态绑定 作用: 及时对页面的数据进行更改
9、 v-on:click 给标签绑定函数,可以缩写为@,例如绑定一个点击函数 函数必须写在methods 里面
10、v-text 解析文本
11、v-html 解析 html 标签
12、v-bind:class 三种绑定方法 1、对象型 '{red:isred}' 2、三元型 'isred?"red":"blue"' 3、数组型'[{red:"isred"},{blue:"isblue"}]'
13、v-once 进入页面时 只渲染一次 不在进行渲染
14、v-cloak 防止闪烁
15、v-pre 把标签内部的元素原位输出
vue 的常用指令以及作用 ·的更多相关文章
- 02: vue.js常用指令
目录:Vue其他篇 01: vue.js安装 02: vue.js常用指令 目录: 1.1 vuejs简介 1.2 选择器:根据id.class等查找 1.3 静态绑定数据 data 1.4 插值 { ...
- Vue - vue.js 常用指令
Vue - vue.js 常用指令 目录: 一. vuejs模板语法之常用指令 1. 常用指令: v-html 2. 常用指令: v-text 3. 常用指令: v-for 4. 常用指令: v-if ...
- vue.js常用指令
本文摘自:http://www.cnblogs.com/rik28/p/6024425.html Vue.js的常用指令 上面用到的v-model是Vue.js常用的一个指令,那么指令是什么呢? Vu ...
- 新人成长之入门Vue.js常用指令介绍(一)
写在前面 作为一个刚步入职场工作的新人,对于公司中所用的技术和框架基本上不懂,只能从最基础的开始做起,进入公司接触的第一个框架就是前端框架Vue.js,几个功能做下来,觉得Vue.js首先学习起来真的 ...
- 【Vue】vue.js常用指令
http://www.cnblogs.com/rik28/p/6024425.html Vue.js的指令是以v-开头的,它们作用于HTML元素,指令提供了一些特殊的特性,将指令绑定在元素上时,指令会 ...
- Vue的常用指令v-if, v-for, v-show,v-else, v-bind, v-on
Vue.js的指令是以v-开头的,它们作用于HTML元素,指令提供了一些特殊的特性,将指令绑定在元素上时,指令会为绑定的目标元素添加一些特殊的行为,我们可以将指令看作特殊的HTML特性(attribu ...
- vue入门-常用指令操作
指令:v-xx组成的特殊指令,如果一个标签中有指令会默认替换原有的书 v-model:实现数据和视图的双向绑定 v-text:在元素中插入值 v-html:在元素中插入标签或者插入文本 v-if:根据 ...
- Vue.js常用指令总结
有时候指令太多会造成记错.记混的问题,所以本文在记忆的时候会采用穿插记忆的方式,交叉比对,不易出错. 本文主要讲了一下六个指令: v-if//v-show//v-else//v-for//v-bind ...
- Vue入门---常用指令详解
Vue入门 Vue是一个MVVM(Model / View / ViewModel)的前端框架,相对于Angular来说简单.易学上手快,近两年也也别流行,发展速度较快,已经超越Angular了.比较 ...
- vue之常用指令
事件缩写 v-on:click= 简写方式 @click= 事件对象$event <!DOCTYPE html> <html lang="en"> < ...
随机推荐
- 【转载】 TensorFlow - 框架实现中的三种 Graph图结构
原文地址: https://zhuanlan.zhihu.com/p/31308381 -------------------------------------------------------- ...
- 5分钟教你使用idea调试SeaTunnel自定义插件
在用Apache SeaTunnel研发SM2加密组件过程中,发现社区关于本地调试SeaTunnel文章过于简单,很多情况没有说明,于是根据自己遇到问题总结这篇文档.SeaTunnel本地调试官方文档 ...
- 【树的直径 求树中距离跟阶段点最远的点】CodeForce1822F.md
CF1822F-Problem - F - Codeforces 题目大意:无根树的每条边为k,定义操作:移动根节点为把当前的根ROOT移动到相邻节点,每次代价为c, 定义成本=从ROOT出发到达的最 ...
- "揭秘CentosChina爬虫项目:掌握Scrapy框架的必备技巧与数据库设计"
Centoschina 项目要求 爬取centoschina_cn的所有问题,包括文章标题和内容 数据库表设计 库表设计: 数据展示: 项目亮点 低耦合,高内聚. 爬虫专有settings custo ...
- SMU Summer 2023 Contest Round 8(2019 陕西省大学生程序设计竞赛)
SMU Summer 2023 Contest Round 8(2019 陕西省大学生程序设计竞赛) B - Grid with Arrows(欧拉图) 题意:一个总规模为\(n × m\)的矩阵,矩 ...
- Java抽象类 小白版
什么是抽象 抽象就是从多个事物中将共性的,本质的内容抽象出来. 什么是抽象类 Java语言中,用abstract关键字修饰的类叫作抽象类.类本身是不存在的,所以抽象类无法创建对象无法实例化. 在面向对 ...
- 解决 Docker CE 在无根模式(rootless)下无法通过 IPv6 拉取映像的问题
折腾一天快把我逼疯了 本来 Docker 对 IPv6 的支持就不好,再来个 rootless,雪上加霜 首先,我们要区分 Docker Engine 和 里面的 Image. 拉取映像是 Docke ...
- docker生产环境jvm性能优化
1.xmx与xms设置多大合适 docker获得的mem_usage的大小是从外部得到的java进程的内存大小,不仅仅是 -Xmx设置的大小,如果 -Xmx和docker分配的内存一致的话,由于jav ...
- Mac升级Ventura 13.0.1后无法远程ssh连接服务器
原因 原因是Mac os Ventura升级了ssh到9.0,ssl到3.3.6,而服务器上的sshd还是老版本:服务器上的老版本ssh和ssl无法和mac上的新版本ssh和ssl交互,新版本ssh加 ...
- 推荐7款美观且功能强大的WPF UI库
前言 经常看到有小伙伴在DotNetGuide技术社区交流群里提问:WPF有什么好用或者好看的UI组件库推荐的?,今天大姚给大家分享7款开源.美观.功能强大.简单易用的WPF UI组件库. WPF介绍 ...