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 的常用指令以及作用 ·的更多相关文章

  1. 02: vue.js常用指令

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

  2. Vue - vue.js 常用指令

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

  3. vue.js常用指令

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

  4. 新人成长之入门Vue.js常用指令介绍(一)

    写在前面 作为一个刚步入职场工作的新人,对于公司中所用的技术和框架基本上不懂,只能从最基础的开始做起,进入公司接触的第一个框架就是前端框架Vue.js,几个功能做下来,觉得Vue.js首先学习起来真的 ...

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

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

  6. Vue的常用指令v-if, v-for, v-show,v-else, v-bind, v-on

    Vue.js的指令是以v-开头的,它们作用于HTML元素,指令提供了一些特殊的特性,将指令绑定在元素上时,指令会为绑定的目标元素添加一些特殊的行为,我们可以将指令看作特殊的HTML特性(attribu ...

  7. vue入门-常用指令操作

    指令:v-xx组成的特殊指令,如果一个标签中有指令会默认替换原有的书 v-model:实现数据和视图的双向绑定 v-text:在元素中插入值 v-html:在元素中插入标签或者插入文本 v-if:根据 ...

  8. Vue.js常用指令总结

    有时候指令太多会造成记错.记混的问题,所以本文在记忆的时候会采用穿插记忆的方式,交叉比对,不易出错. 本文主要讲了一下六个指令: v-if//v-show//v-else//v-for//v-bind ...

  9. Vue入门---常用指令详解

    Vue入门 Vue是一个MVVM(Model / View / ViewModel)的前端框架,相对于Angular来说简单.易学上手快,近两年也也别流行,发展速度较快,已经超越Angular了.比较 ...

  10. vue之常用指令

    事件缩写 v-on:click= 简写方式 @click= 事件对象$event <!DOCTYPE html> <html lang="en"> < ...

随机推荐

  1. 【FTP】小米手机FTP传输

    设置方法 打开[文件管理],右上角按钮选择[远程管理] 点击设置按钮 默认保持唤醒状态 设置FTP账户的用户名密码 Windows访问: 然后开启服务即可: 手机和电脑连接同一个网络内访问 每次接入网 ...

  2. 【微信小程序】05 设备信息 & 请求API

    获取系统信息(设备信息) https://developers.weixin.qq.com/miniprogram/dev/api/base/system/wx.getSystemInfo.html ...

  3. 【JDBC】Extra03 PostgreSQL-JDBC

    PostgreSQL的JDBC实现: <!-- https://mvnrepository.com/artifact/org.postgresql/postgresql --> <d ...

  4. 【Layui】03 按钮 Button

    文档位置: https://www.layui.com/doc/element/button.html 01.[按钮主题] <div> <button type="butt ...

  5. 灵巧手 —— 智能仿生手 —— 人形机器人(humanoid)

    产品主页: https://www.brainco.cn/#/product/brain-robotics 国内销售的一款产品,美国华人生产的,灵巧度非常高的一款仿生手产品.

  6. 在深度计算框架MindSpore中如何对不持续的计算进行处理——对数据集进行一定epoch数量的训练后,进行其他工作处理,再返回来接着进行一定epoch数量的训练——单步计算

    如题所述: 深度学习框架MindSpore是华为公司研发的,由于性能设计的原因,MindSpore的一些使用方式和TensorFlow和PyTorch有一些不同,其中的一点就是在进行单步计算或者是非持 ...

  7. 对于围棋AI作弊的一些思考

    最近看到些关于围棋AI作弊的报道有了一些思考. 相关视频链接: https://www.bilibili.com/video/BV1np411f73b/?spm_id_from=autoNext ht ...

  8. 重磅预告!Apache DolphinScheduler 3.2.0 新功能“剧透”

    近期,Apache DolphinScheduler 将迎来 3.2.0 版本的到来.本次发版为大版本发布,将会带来众多大家期待已久的新功能和新改进.为了让用户提前感知到新版本的变化,社区特意提前&q ...

  9. C语言之父和Linux之父谁更伟大?

    前言 在计算机软件领域,做出过重大贡献的神人很多,比如:<计算机程序设计艺术>(The Art of Computer Programming)一书的作者- Donald Knuth:Pa ...

  10. JavaScript设计模式样例九 —— 桥接模式

    桥接模式(Bridge Pattern) 定义:是用于把抽象化与实现化解耦,使得二者可以独立变化. 目的:将抽象部分与实现部分分离,使它们都可以独立的变化. 场景:实现系统可能有多个角度分类,每一种角 ...