位置:电子教程 > Vue.JS入门教程 (如果看不到内容请使用360浏览器) 推荐学习资源
Vue.js入门
Vue.js 数据绑定
Vue.js中的指令
Vue.js 表单和双向数据绑定
Vue.js 条件和循环指令
Vue.js 循环语句v-for
Vue.js 样式绑定
Vue.js 事件处理器
Vue.js 监听属性
Vue.js 计算属性
Vue.js 组件 Component
Vue.js 自定义指令
Vue.js 路由
Vue.js 过渡和动画
Vue.js 响应接口
Vue.js中Ajax(Axios)
当前阅读教程:Vue.JS入门教程 > Vue.js中的指令
阅读(22555525)      收藏       赞(5685)      分享
上一篇: Vue.js中提供了完全的JavaScript表达式支持 下一篇: 基础用法

常用指令

指令名称

描述

使用

v-model

绑定数据

<input v-model="message">

v-text

输出文本,不能解析标签

<p v-text="message"></p>

v-html

输出文本,可解析标签

<p v-html="message">/p>

v-once

只绑定一次数据

<p v-once >{{message}}</p>

v-bind

绑定属性

<img v-bind:src="imgurl">

或 <img :src="imgurl">

v-if

控制是否显示容器 值转为布尔

为false时 注释该容器,反之true显示

<div v-if="true"></div>

v-show

控制是否显容器

改变的时display:none/block

<div v-show="true"></diiv>

v-for

循环遍历数组、对象

<li v-for="(val,key) in   arr">{{val}}</li>

v-cloak

在还没有执行到vue代码的时候隐藏元素

可解决‘闪烁'问题

<p v-cloak>{{message}}</p>


上一篇: Vue.js中提供了完全的JavaScript表达式支持 下一篇: 基础用法
毕业设计网             广告联系QQ:45157718(微信同号)