export default {
name: "HelloWworld",
data: function () {
return {
isHidden: false,
isWelcome: false,
isFadeout: false,
}
} <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="isHidden = true"> HELLO</button>
</div>
<div v-if="isWelcome && isHidden">
//some code for screen 4
<button v-on:click="isHidden = true"> Fine</button>
</div>
如何有条件地渲染屏幕。到三个屏幕为止，其渲染成功完成，但是卡在了第三个屏幕按钮上，在该按钮上没有重定向到第四个屏幕
尝试使用它并尝试为第四个屏幕按钮添加所需的代码
<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>
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
我来说两句