将值传递给多个函数

Posted 2023-02-22

【中文标题】将值传递给多个函数

【英文标题】：pass value into multiple functions

【发布时间】：2021-12-07 00:29:26

【问题描述】：

我在v-for 中有一个v-for。单击我选择的dropdown-item 后，我将数据传递给我的methods - 当然，这很好用。

但现在我需要在我的方法中的另一个函数中使用确切的 itemDropdown.ID...

我是否必须在方法之间传递数据，或者我该如何解决？

谢谢！

<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
    

【问题讨论】：

你能在 inputDropdown() 中调用 anotherFunction() 吗？是不是搞砸了你的逻辑？

这能回答你的问题吗？ How to call multiple functions with @click in vue?

不清楚您的问题是什么...您如何调用anotherFuntion()？如果您从inputDropdown() 调用它，最明显的方法是传递ID，因为它已经在范围内

【参考方案1】：

我认为写一些类似的处理方法会更好，你也可以用其他方法扩展使用。

<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>

我认为这样的用法会更具可读性。

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

  inputDropdown(ID) 
    //Some code
  ,

  anotherFunction(ID)
   // Some code
    

【讨论】：

嗨，这似乎有效。但是，如果anotherFunction 是我的模板中的当前函数，带有anotherFunction(value, value, value) 之类的参数，是否也可以将ID 传递给这个函数？

是的，但您需要使用dropdownClickHandler(itemDropdown.ID, itemDropdown.value) 等附加参数进行修改。或者更好的版本只是通过dropdownClickHandler(itemDropdown) 并在inputDropdown 和anotherFunction 中使用对象解构来获取参数developer.mozilla.org/en-US/docs/Web/javascript/Reference/…