案例:Vue.js案例     状态:可编辑再运行    进入竖版
 运行结果 
AخA
 
1
<!DOCTYPE html>
2
<html>
3
<head>
4
<meta charset="utf-8">
5
<title>Vue 测试实例 - W3xue教程(w3xue.com)</title>
6
<script src="//unpkg.com/vue/dist/vue.js"></script>
7
</head>
8
<body>
9
<div id="app">
10
    <div v-if="type === 'A'">
11
      A
12
    </div>
13
    <div v-else-if="type === 'B'">
14
      B
15
    </div>
16
    <div v-else-if="type === 'C'">
17
      C
18
    </div>
19
    <div v-else>
20
      Not A/B/C
21
    </div>
22
</div>
23
    
24
<script>
25
new Vue({
26
  el: '#app',
27
  data: {
28
    type: 'C'
29
  }
30
})
31
</script>
32
</body>
33
</html>