VueJS - вложение v-on: щелчок и v-if компоненты исчезают

Question

Всякий раз, когда я вкладываю v-on: щелкаю внутри v-if, весь div исчезает. Что я делаю не так?

<div v-if="!signInIsHidden1" >
  <div v-on:click="!signInIsHidden = signInIsHidden" style="text-align:center"><br>Register</div></div>

Answer 1

В выражениях VueJS должен быть допустимый JavaScript.

Это:

!signInIsHidden = signInIsHidden

немного задом наперед. Я думаю, что вы имели в виду:

signInIsHidden = !signInIsHidden

Еще лучше перенести это назначение в метод VueJS:

...
methods: {
    toggleSignIn: function() {
        this.signInIsHidden = !this.signInIsHidden;
    }
}
...

<div :click="toggleSignIn"></div>

Кроме того, у вас есть signInIsHidden1 во внешнем div, но без 1 в событии click.