Vus.js v-if based on reactive data: view not reactive

I'm new to vue.js and I'm having trouble to understand the conditionnal rendering. Here in my template a button I'd like to render conditionnaly:

<q-chip v-if="validationRequestSent===false" @click="initiateValidation(prop.node.id)">
 Request validation
 </q-chip>

validationRequestSent is a reactive data:

<script lang="js">

  export default {
    data() {
      return {
        validationRequestSent: false
      }
    },

When I click on the button, I set validationRequestSent to true:

 async initiateValidation(id) {
        this.validationRequestSent= true;
        const validationId = await ValidationClient.initiateValidation(id)
        this.validationRequestSent= false;
        this.$router.push({name: this.determineRouteAfterInitiateValidation()});
      },

I was hoping that the button would then dissapeared, but nothing happens. Can someone help me understand what happens?