可以通过以下方法实现:

  1. 在data中定义一个数组,用于存储选择的数据:
data: {
  selectedItems: []
}
  1. 在选择数据时,将数据添加到数组中:
onSelectItem(item) {
  this.selectedItems.push(item)
}
  1. 在取消选择时,从数组中删除数据:
onCancelSelect(item) {
  const index = this.selectedItems.indexOf(item)
  if (index !== -1) {
    this.selectedItems.splice(index, 1)
  }
}

完整代码示例:

<template>
  <view>
    <view class="items">
      <view class="item" v-for="item in items" :key="item.id">
        <view>{{ item.name }}</view>
        <button @tap="onSelectItem(item)">选择</button>
        <button @tap="onCancelSelect(item)">取消</button>
      </view>
    </view>
    <view class="selected-items">
      <view v-for="item in selectedItems" :key="item.id">{{ item.name }}</view>
    </view>
  </view>
</template>

<script>
export default {
  data() {
    return {
      items: [
        { id: 1, name: '选项1' },
        { id: 2, name: '选项2' },
        { id: 3, name: '选项3' },
      ],
      selectedItems: []
    }
  },
  methods: {
    onSelectItem(item) {
      this.selectedItems.push(item)
    },
    onCancelSelect(item) {
      const index = this.selectedItems.indexOf(item)
      if (index !== -1) {
        this.selectedItems.splice(index, 1)
      }
    }
  }
}
</script>
``

原文地址: https://www.cveoy.top/t/topic/cFCy 著作权归作者所有。请勿转载和采集!

免费AI点我,无需注册和登录