在函数中放置一个值（已解决）

Question

在 vue.js 中，我希望能够做到这一点：

<ul>
  <li v-for="item in preDefItems">
      <span v-model="itemName">{{ item.name }}, {{ item.price}}</span>
      <input type="button" value="+" v-on:click="addItem({{item.name}}, {{item.price}}, {{item.name}})"/>
  </li>
</ul>

然后使用方法addItem()函数，检索值。但我发现上面的方法不起作用？

我想使用 vue.js 访问函数并发送值。

  const app = Vue.createApp({
data() {
  return {
    itemType: '',
    itemName: '',
    itemUrl: '',
    itemNumber: null,
    added: 'no',
    order: [],
    preDefItems: [
      { name: 'Apple', type: 'Fruit', price: '2.00' },
      { name: 'Banana', type: 'Fruit', price: '1.00' },
      { name: 'Orange', type: 'Fruit', price: '2.50' },
      { name: 'Kiwi', type: 'Fruit', price: '3.00' },
      { name: 'Cherries', type: 'Fruit', price: '5.00'}        ]
  }
},
methods: {
  addItem(){
    let item = {
      name: itemName,
      number: itemNumber,
      url: itemUrl
    }
    this.added = 'yes'
    this.order.push(item)
  }
}

}） app.mount('#app')

Answer 1

您需要按如下方式使用它：

<input type="button" value="+" v-on:click="addItem(item.name,item.price)"/>