v-show versus .d-flex !!

While programming with Vue/Bootstrap, I was facing one case that v-show is not working unexpectedly.
In the below example, those two div elements are always visible, not based on showBack.
So I wondered, is Vue having some internal problem? :)

<div class="d-flex justify-content-between" v-show="showBack">
~~
</div>
<div class="d-flex justify-content-end pt-4" v-show="!showBack">
~~
</div>

But finally I noticed, the reason.
v-show="false" => display: none;
.d-flex in bootstrap, => display: flex!important. omg~~

Do you have any experience like this?
With this opportunity, I noticed, that I am not still professional myself. lol

Comments

[valentinesean]

Hey, did you manage to solve this issue?

[Ali Asgar L. Laut]

I used v-if instead

[StalinWesley]

thankd

[Stephan Simonett]

Sadly, the same behavior is in Vuetify. All display classes use important, which makes the use of v-show impossible. :(