码迷,mamicode.com
首页 > 其他好文 > 详细

vue 指令总结

时间:2019-02-25 00:41:25      阅读:203      评论:0      收藏:0      [点我收藏+]

标签:red   html   对象   维数   v-for   bind   就是   元素   mode   

templet:‘ ‘,templet中只能有一个根节点;

v-text:只能用于双标签中,就是给元素的innerText赋值;

v-html:就是给元素的innerhtml赋值;

  <span v-text="myText"></span>

  <span v-text="myText"></span>

v-if:如果值为false,在HTML中显示<!---->,为true就插入元素,v-else-if;v-else;

  <button v-if=" num == 1 "></button>

  <button v-else-if-=" num == 2 "></button>

  <button v-else ></button>

v-show:是显示与否的问题;

v-bind:给属性绑定值,从vue到页面的单向数据流

v-bind:value = "变量" ,简写::file=" ‘常量定义‘ ";

v-on:点击后给属性赋值

  v-on:click = " myValue = ‘ abc‘ ",简写:@click = " ";

v-model:双向数据邦定,只能给具备value的属性元素进行双向绑定;

v-for:循环数组或对象,

  <ul>

    <li v-for = " item in stus"  :class = " item.myClass">{{ item.name}} </li>

  </ul>

  stus:变量,stus维数组时:(item,index)  :class = " index%2 == 0? ‘ red ‘:‘ green ‘  ";

  为对象时:v-for = "(value,key,index)in stus";

vue 指令总结

标签:red   html   对象   维数   v-for   bind   就是   元素   mode   

原文地址:https://www.cnblogs.com/zhangweigang/p/10428540.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!