vue基础知识06

条件渲染指令：
1.v-if v-else v-else-if
条件渲染，确保在切换过程中条件块内的事件监听器和子组件适当地被销毁和重建。（课程并没有说最后那个怎么使用，所以我也不太会用！）
2.v-show
元素被渲染，只是简单基于CSS进行切换。
新建组件：IfAndShow.vue

//template里面的内容，前述很多，不再重复书写。
<div v-if = "flag">Let is go to school!</div>
<div v-else>Do not go to school!</div>
<button @click="flag=!flag"></button>
//前者真实处理DOM标签，后者切换样式达到目的；
<div v-show = "flag">Let is go to school!</div>
<div v-show = "!flag">Do not go to school!</div>
<button @click="flag=!flag"></button>

//script里面的内容，前述很多，不再重复书写。
data(){
    return{
        flag: true,
        }
      }