Удалить разметку комментария, созданную условием v-if

Question

хочу удалить условную разметку комментария () из HTML

Я использую условие, например

<sidebar v-if="showSidebarTrigger"> ... </sidebar>

когда условие ложно в сгенерированном dom, я хотел это удалить

Answer 1

Это то, что я обнаружил, сказал Эван Ю (Evan You) о связанной проблеме Github

v-if обычно используется для элементов в относительно стабильной структуре узлов, рендеринг их в пустые теги комментариев делаетСписки vnode отличаются большей эффективностью, поскольку списки более «стабильны», и это позволяет избежать некоторых крайних случаев, когда элементы не имеют ключей.

Как указано в заявлении далее, здесь будет работать связанный обходной путь - вы можете использовать v-for в качестве альтернативы, если вам не нужно много таких тегов комментариев в DOM.

Makecomputed свойство скажет displaySideBar, и введите showSidebarTrigger условно в array и верните его.

displaySideBar() {
let showSideBar = []
  if(showSidebarTrigger) {
    showSideBar.push(showSidebarTrigger)
  }
}

Теперь в вашем html-разделе

<div v-for="(sideBar, index) in displaySideBar" :key="`sideBar-${index}`">
   <h1> Hey </h1>
</div>