vue-条件渲染

1.条件渲染
1.1v-if
<h1 v-if="ok">Yes</h1>
1.2v-if else
<h1 v-if="ok">Yes</h1>
<h1 v-else>No</h1>
<div v-if="type === 'A'">
  A
</div>
<div v-else-if="type === 'B'">
  B
</div>
<div v-else-if="type === 'C'">
  C
</div>
<div v-else>
  Not A/B/C
</div>
2.用key管理可以复用的元素
<template v-if="loginType === 'username'">
  <label>Username</label>
  <input placeholder="Enter your username" key="username-input">
</template>
<template v-else>
  <label>Email</label>
  <input placeholder="Enter your email address" key="email-input">
</template>
3.v-show指令
v-show :只是替换原来的css显示和隐藏
不支持 <template> 语法,也不支持 v-else

posted @ 2017-03-24 13:42  小拽A  阅读(212)  评论(0编辑  收藏  举报