lundi 22 juillet 2019

Vue.js: Inline if-else statement inside with multiple conditions

Is there a way to make inline if-else statement with multiple conditions in Vue?

I have this code in vue:

<template>
  <div class = "modal-dialog">
    <div class = "modal-header"> <h5>Header</h5></div>
     <div class="modal-body">
       <form @submit.prevent="editMode ? updateParticipant() : addParticipant()">
          /* actual form inside modal body */
       </form>
     </div>
  </div>
</template>

However, I have another boolean variable queryMode. So, I want to also check its value before I execute the methods. More of a nested statement like this:

if(editMode) {
  if(queryMode) { 
     updateParticipant();
  } else {
     //another method
  }
} else {
   addParticipant();
}

I have searched about v-if, v-else-if and v-else, but I don't know how to integrate them in my current code structure.

Aucun commentaire:

Enregistrer un commentaire