v-show in same HTMLElement but different Component the result is no expected
Version
3.0.0-rc.10
Reproduction link
https://codesandbox.io/s/sweet-benz-hm3z5 code like in Parent
<div id="app">
<Home v-show="true" />
</div>
and Home template is
<div v-show="false">something other</div>
Steps to reproduce
click toggle button to set app.show=true
What is expected?
expected Home component invisible
What is actually happening?
now Home is visible
i think if any v-show is false, the result is invisible
v-show
works by toggling a DOM element's display
style property. Using v-show
on a component implicitly applies that v-show
on that component's root node. You are essentially creating two v-show
with contradicting values on the same node, which doesn't make any sense.