6-Vue 条件渲染和列表渲染

v-if 指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回 truthy 值的时候被渲染。
v-else 元素必须紧跟在带 v-if 或者 v-else-if 的元素的后面,否则它将不会被识别。

yes

no

var app1 = new Vue({
            el: '#app1',
            data: {
                ok: true
            }
        });

用 key 管理可复用的元素

var app2 = new Vue({
          el: '#app2',
          data: {
            loginType: 'username'
          },
          methods: {
            toggleLoginType: function () {
              return this.loginType = this.loginType === 'username' ? 'email' : 'username'
            }
          }
        });

带有 v-show 的元素始终会被渲染并保留在 DOM 中。v-show 只是简单地切换元素的 CSS 属性 display。
注意,v-show 不支持