Vue 按鈕點擊控制顯示隱藏

<div id="app">
            <div v-show="isShow">我曾經擁有者一切，轉眼間都煙消雲散；</div>
            <button @click="click">{{message}}</button>
        </div>

先寫一個div  里面寫內容

再寫一個按鈕 寫一個@click=“click”  方法

 

new Vue({
         el:"#app",
         data:{
             isShow:false,
             message:'顯示'
              },
         methods:{
           click(){
              this.isShow = !this.isShow;
              if(this.isShow){
                  this.message='隱藏';
                 }else{
                  this.message='顯示';
                 }
               }
             }
          })

效果圖：

顯示：

 

隱藏：