[Vuejs]-Vue.js, How to check v-if directive with the results of an asynchronous function

by

0👍

If I were you I would use the v-if (or v-show) directive with a variable. I haven’t tested the snippet below, but something like this should work:

try{
  let response = await axios.get('service/${link}')
      this.useThisVariableInVIF = true // or response.data.message;
  }catch(error) {
      this.useThisVariableInVIF = false;
      console.log(error);
    };
}

Then just v-else-if="useThisVariableInVIF"

0👍

you need not store the data of this call in an data variable,you can modify your code like this.

    <router-link v-else-if="hasValue" target="_blank" :to= "origin/link" >
        <span @click="checkValue(origin.link)">
             {{ origin.value }} 
        </span>
    </router-link>

   <script>
      export default {
           data: function {
              return {
                hasValue: false
              }
           }
           created: function() {
              axios.get('service/${link}').then(c => {
                   this.hasValue = !!c
              })
            
          }
      }
  </script>

Leave a comment