pass value into multiple functions-CodePudding

I have a v-for in a v-for. After clicking on my selected dropdown-item I pass my data to my methods - this works well, of course.

But now I need the exact itemDropdown.ID in another function in my methods...

Do I have to pass data from method to method or how can I solve that?

Thank You!

<div v-for="(item, index) in json" :key="index">
  <b-dropdown text="Selection" right>
    <b-dropdown-item v-for="(itemDropdown, indexDropdown) in json2" :key="indexDropdown" @click="inputDropdown(itemDropdown.ID)">{{itemDropdown.Name}}</b-dropdown-item>
  </b-dropdown> 
</div>

methods: {
  inputDropdown(ID) {
    //Some code
  },

  anotherFunction(here I need this itemDropdown.ID as well!)
  //Do some code too
  }  
}

CodePudding user response：

I think it would be better to write some handler method like that and you can extend the usage with other methods too.

<div v-for="(item, index) in json" :key="index">
  <b-dropdown text="Selection" right>
    <b-dropdown-item v-for="(itemDropdown, indexDropdown) in json2" :key="indexDropdown" @click="dropdownClickHandler(itemDropdown.ID)">{{itemDropdown.Name}}</b-dropdown-item>
  </b-dropdown> 
</div>

I think that it would be more readable in a usage like that.

methods: {
  dropdownClickHandler(ID) {
    this.inputDropdown(ID);
    this.anotherFunction(ID);
  },

  inputDropdown(ID) {
    //Some code
  },

  anotherFunction(ID)
   // Some code
  }  
}