vue指令
1.基本写法:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<script type="text/javascript" src="../assets/js/vue.js"></script>
<title>Helloworld</title>
</head>
<body>
<h1>Hello World</h1>
<hr>
<div id="app">
{{message}}
</div>
<script type="text/javascript">
var app=new Vue({
el:'#app',
data:{
message:'hello Vue!'
}
})
</script>
</body>
</html>
2.v-if,v-else指令:判断是否加载HTML的dom,否则执行v-else;
v-show:调整css的dispaly属性,DOM已经加载,只是CSS控制没有显示出来。
3.v-for:模板循环 <li v-for="item in items">{{item}}</li>
js:var app=new Vue({
el:'#app',
data:{
items:[,,,]
}
})
4.computes属性:里面声明函数对象
5.v-text:网速过慢时,不会暴露{{xxx}}内容
v-html:js中有html标签
6.v-on:绑定事件监听器 v-on:vlick=“ ” 在new Vue({})中写methods
7.v-model:双向绑定,把数据绑定在特定的表单元素上,改表数据可同时更改文本数据
修饰符:.lazy点击其他输入框才改变 .number输入数字改变 .trim输入去掉首尾空格
8.v-bind:绑定值,要在vue中的data属性中声明;绑定css样式
9.v-prev:输入原始值
v-cloak:vue渲染完整个dom后显示,必须和css样式一起使用
v-once:第一次dom时进行渲染,渲染完成后视为静态内容,跳出以后的渲染过程