vue two day

v-bind:

属性绑定。语法为v-bind:属性="xxx"。 简写:属性="xxx"。

控制样式语法:

<style type="text/css"/>
.app{
display:none
}
<style>

<div id="aap" :class="{app:isshow}"><div>
<!-- 第二中写法 -->
<div id=:aap: :class="["aaa"]"><div>
<script>
var aap=Vue({
el:"#aap:,
data:{
isshow:true,
aaa:"app"
}
})
<script>

v-if:

根据表达式的值的 来有条件地渲染元素。在切换时元素及它的数据绑定 / 组件被销毁并重建。

v-else:

限制:前一兄弟元素必须有 v-if 或 v-else-if

为 v-if 或者 v-else-if 添加“else 块”。

v-else-if:

限制:前一兄弟元素必须有 v-if 或 v-else-if

表示 v-if 的“else if 块”。

v-show:

用法:

根据表达式之真假值,切换元素的 display

当条件变化时该指令触发过渡效果。

v-if 和v-show得区别为v-if是创建或者销毁dom,v-show是隐藏或者展示dom。

v-for:

特定语法:x in list 或者 x,i in list,x为数据,i为索引。

可以添加key="x.id"帮助vue区分,提供性能。

例:<li key:"item.id" v-for="item in list">

没有id可以用索引,反正就是唯一标识。

v-for遍历dict:

(value,key,index) in dict

当和 v-if 一起使用时,v-for 的优先级比 v-if 更高。

猜你喜欢

转载自www.cnblogs.com/zy-mousai/p/12980500.html
two