vuejs5-v-show指令

简介:


<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

<title></title>

</head>

<body>

<div id="app">

<h1>Hello,Vue.js!</h1>

<h1 v-show="yes">Yes!</h1>

<h1 v-show="no">No!</h1>

<h1 v-show="age >= 25">Age:`age`</h1>

<h1 v-show="name.indexOf('jack') >= 0">Name:`name`</h1>

</div>

<script src="http://static.runoob.com/assets/vue/1.0.11/vue.min.js"></script>

<script>

var vm = new Vue({

el:"#app",

data:{

yes:true,

no:false,

age:28,

name:'keepfool'

}

});

</script>

</body>

</html>

本文转自  素颜猪  51CTO博客,原文链接:http://blog.51cto.com/suyanzhu/1895497
相关文章
|
1月前
|
JavaScript 前端开发
请详细解释一下Vue的模板语法中各个指令的具体用法。
请详细解释一下Vue的模板语法中各个指令的具体用法。
20 2
|
2月前
|
JavaScript 前端开发 算法
千分位分隔?一个vue指令搞定
千分位分隔?一个vue指令搞定
47 0
|
2月前
|
JavaScript 前端开发 算法
函数防抖?一个vue指令搞定
函数防抖?一个vue指令搞定
35 0
|
3月前
|
安全 JavaScript Go
Vue中的v-html指令有什么潜在的安全风险?如何防范?
Vue中的v-html指令有什么潜在的安全风险?如何防范?
166 1
|
8天前
|
JavaScript
VUE指令: 什么是Vue的修饰符?
Vue修饰符是特定的指令后缀,如`.lazy`或`.prevent`,它们改变指令行为:表单处理(v-model)、事件处理(阻止默认行为、阻止冒泡)、鼠标键定制、键值简化绑定及属性动态绑定(v-bind)。这些修饰符增强指令灵活性,适应不同场景需求。
8 0
|
13天前
|
JavaScript 前端开发
|
13天前
|
JavaScript 前端开发
vue的常用指令
vue的常用指令
N..
|
30天前
|
JavaScript 前端开发 开发工具
Vue.js指令
Vue.js指令
N..
11 0
N..
|
30天前
|
JavaScript 前端开发 开发者
Vue.js的v-for指令
Vue.js的v-for指令
N..
13 1
|
1月前
|
JavaScript 前端开发
vue常见的指令(14个)
Vue.js 的指令是一种特殊的带有 `"v-"` 前缀的属性,用于在DOM元素上添加动态行为。常用的 Vue 指令包括:`v-model,v-for,v-show,v-hide,v-if,v-else-if 和 v.else,v-bind,v-on,v-text 和 v-html,v-once,v-slot,v-pre 和 v-cloak`。