javascript - 从标签获取内容并将其保存在 vue 变量中的最有效方法

Question

我在vue中有这段代码

<ul>
      <li v-for="exchange in finalExchanges"><button class="resultBtn"> {{exchange}} <hr></button></li>
</ul>

使用以下js

export default {
name: 'exchange',
data () {
  return {
    exchanges,
    msg: 'Exchange',
    search: ''
  }
},
computed: {
finalExchanges() {
  return this.exchanges.filter(exchange => {
    return exchange.includes(this.search)
   })
  }
 }
}

我很想知道获取用户点击的 {{exchange}} 并将其保存在变量中的最有效方法是什么。我认为有很多方法，比如使用 document.getElementById() ，也可能是 vue 方法，但考虑到它是如何面向 future 的，我正在寻找一种有效的方法来做到这一点。任何意见都将受到高度赞赏!

Answer 1

如果您的数据中有一些变量，例如“selectedExchange”，并且您希望将单击的交换分配给该变量，您只需添加到按钮即可:

<button @click="selectedExchange = exchange"...>

如果我正确地理解了这个问题，这肯定是获得点击交换的最常见且可能是最有效的方法。

如果您想将单击的交换用作方法中的变量，您只需输入:

<button @click="someFunction(exchange)"...>

然后你只需在你的方法中得到它，例如:

...
methods: {
  someFunction: function( ex ) {
    ... // ex will be the clicked exchange
  }
}