vue 笔记
Posted 东方不败--Never
tags:
篇首语:本文由小常识网(cha138.com)小编为大家整理,主要介绍了vue 笔记相关的知识,希望对你有一定的参考价值。
1、插值表达式
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="vue.min.js"></script> </head> <body> <div id="app"> name name2 </div> </body> <script type="text/javascript"> new Vue( el:"#app", data: name:"rer", name2:"xxx" ) </script> </html>
2、v-text、v-html、v-model、v-bind
v-model:双向绑定,绑定模型和视图
v-bind:绑定属性,v-bind:href=""
<body> <div id="app"> <h6 v-text="name"></h6> <div v-html="name2"></div> <input type="text" v-model="name"/>name <a v-bind:href="ahref">百度一下</a> </div> </body> <script type="text/javascript"> new Vue( el:"#app", data: name:"zd", name2:"<input type=\\"text\\">", ahref:"http://baidu.com" ) </script> </html>
3、v-if、v-show
v-if:是将元素从树模型中增加或者删除。切换消耗大,安全性高。
v-show:相当于display 这个属性。切换消耗小。
<body> <div id="app"> <h6 v-if="isShow">xiaoqi</h6> <h6 v-show="isShow">xiaoqi</h6> </div> </body> <script type="text/javascript"> new Vue( el:"#app", data: isShow:false ) </script>
4、v-for
以上是关于vue 笔记的主要内容,如果未能解决你的问题,请参考以下文章