條件渲染以在vue中顯示組件

Question

我有一個父組件，其中的內容應該有條件地顯示

當userinput變量為假時
應刪除<div class="parent">並顯示 PopUp 組件

我嘗試使用 `v-if` 但不知道如何刪除整個 div 元素

我只能用v-if else改變單個元素

母公司

<template>
    <div>
        <button>x</button>
        <p>errorMessage</p>
    </div>
</template>

子組件 - PopUp

 <template> <div> <button>x</button> <p>errorMessage</p> </div> </template>

Answer 1

添加v-if="userinput"不起作用？

如果我明白你想要什么，你應該有這樣的東西：

 // parent comp <template> <div> <h1>header</h1> <div v-if="userinput" class="parent"> <h2>infos</h2> <button>x</button> </div> <PopUp v-else/> </div> </template>

不要猶豫，閱讀Vue.js 文檔