如何从复选框中获取id以检查是否在vue3中被选中

Question

<div>
  <input 
    type="checkbox" 
    class="delete-checkbox" 
    :id=this.products[index].sku  
    @click="setDelete(this.products[index].sku)" />
</div>

我正在构建一个 vuex 应用程序，我尝试在选中此复选框时启动一个事件，但我不知道该怎么做。

有人可以帮帮我吗？

Answer 1

请查看以下代码段：

const demo = {
  data() {
    return {
      products: [{sku: 1}, {sku: 2}, {sku: 3}],
    };
  },
  methods: {
    setDelete(id) {
      console.log('event fired for: ' + id)
    }
  },
};
Vue.createApp(demo).mount("#demo");

<script src="https://unpkg.com/vue@next"></script>
<div id="demo">
  <li v-for="(product, idx) in products" :key="idx">
    <input type="checkbox" class="delete-checkbox" :id="product.sku" @click="setDelete(product.sku)">
  </li>
</div>

如何从复选框中获取id以检查是否在vue3中被选中

How to get id from the checkbox to check if is checked or not in vue3

javascript

web

vue.js

vuex

vuejs3