Try catch on v if

I have a v-if that shows an error message in HTML

    <div id="error" v-if="showError">Error User or Password</div>

  data() {
    return {
      showError: false,
};}

if I set in data showError: true it appears.

But when I call it in inside my catch:

  catch (error) {
    alert('Usuário ou senha inválidos')

  }

the alert works fine but if I send

showError = true

or

showError: true;

do not appears the error message in HTML(v-if)

how do i do that?

Answer

You need to set the member to true and then wait for a while before you set it to false. Like this:

this.showError = true;
setTimeout(() => {
    this.showError = false;
}, 1000);