Javascript 如何在Vuejs中有条件地呈现屏幕？

导出默认值{
名称：“HelloWworld”，
数据：函数（）{
返回{
伊希登：错，
isWelcome:false，
isFadeout:false，
}
}

//screen1的一些代码
你好
//屏幕2的一些代码
你好
//屏幕3的一些代码
你好
//屏幕4的一些代码
好的

尝试使用此选项，并尝试为第四个屏幕按钮添加所需的代码

    <div  v-if="!isHidden">
 //some code for screen1
 
  <button v-on:click="isHidden = true"> HELLO</button>
  </div>
  
   <div  v-else-if="isHidden && !isFadeout">
 //some code for screen 2
 
  <button v-on:click="isFadeout = true"> Hi</button>
  </div>
  
   <div  v-else-if="isFadeout && isHidden && !isWelcome">
 //some code for screen 3
 
  <button v-on:click="isWelcome = true"> HELLO</button>
  </div>
  
   <div  v-else-if="isWelcome">
 //some code for screen 4
 
  <button>Fine</button>
  </div>

//screen1的一些代码
你好
//屏幕2的一些代码
你好
//屏幕3的一些代码
你好
//屏幕4的一些代码
好的

它应该适合你

<div  v-if="!isHidden">
 //some code for screen1
 
  <button v-on:click="isHidden = true"> HELLO</button>
  </div>
  
   <div  v-if="isHidden && !isFadeout">
 //some code for screen 2
 
  <button v-on:click="isFadeout = true"> Hi</button>
  </div>
  
   <div  v-if="isFadeout && isHidden">
 //some code for screen 3
 
  <button v-on:click="isWelcome = true"> HELLO</button>
  </div>
  
   <div  v-if="isWelcome && isHidden">
 //some code for screen 4
 
  <button v-on:click="isHidden = true"> Fine</button>
  </div>

//screen1的一些代码
你好
//屏幕2的一些代码
你好
//屏幕3的一些代码
你好
//屏幕4的一些代码
好的

更改了，仍然是相同的问题。我们需要创建调用第四屏幕的功能吗？上面一个会在单击第三屏幕按钮时显示第三和第四屏幕…尝试签出一次