老街一角 2021-11-13 11:25 采纳率: 68.8%
浏览 46
已结题

如何使复选框的不限改为不选

img


<template>
  <div style="margin: 50px;">
    <div v-for="(v,i) in arrList" :key="i">
      <el-checkbox-group v-model="arrList[i]">
        <el-checkbox 
          v-for="(item) in data" :key="item.id" 
          :label="item.id" 
          :disabled="computedDisable(item.id,i)"
          @change="changeCheck($event,item.id,i)"
        >
          <div style="margin-bottom: 10px;">{{ item.name }}{{ item.id }}</div>
        </el-checkbox>
      </el-checkbox-group>
    </div>
    <el-button @click="add">添加</el-button>
  </div>
</template>
<script>
  export default {
    data() {
      return {
        arrList: [
          [0]
        ],
        data: [
          {
            id: 0,
            name: "不限",
            identity: "nolimit",
            disable: false
          },
          {
            id: 1,
            name: "采购人",
            identity: "owner_name",
            disable: false
          },
          {
            id: 2,
            name: "供应商",
            identity: "bid_name",
            disable: false
          },
          {
            id: 3,
            name: "中介方",
            identity: "agency_name",
            disable: false
          },
          {
            id: 4,
            name: "共同投标公司",
            identity: "candidate_name",
            disable: false
          },
        ]
      }
    },
    methods: {
      computedDisable(id, i) {
        if (this.arrList[i].includes(id)) {
          return false
        }
        return !!this.arrList.flat().includes(id)
      },
      changeCheck(e, val, ind) {
        if (e) {
          if (val === '不限') {
            this.arrList[ind] = ['不限'];
          } else {
            const index = this.arrList[ind].findIndex(item => item === '不限');
            if (index > -1) {
              this.arrList[ind].splice(index, 1);
            }
          }
          if (this.arrList[ind].length > 1) {
            this.arrList[ind].shift()
          }
        }
      },
      add() {
        this.arrList.push([])
      }
    }
  }
</script>

  • 写回答

2条回答 默认 最新

  • 你好!机器人 2021-11-13 14:41
    关注

    img

    img

    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 12月7日
  • 已采纳回答 11月29日
  • 创建了问题 11月13日

悬赏问题

  • ¥15 R语言Rstudio突然无法启动
  • ¥15 关于#matlab#的问题:提取2个图像的变量作为另外一个图像像元的移动量,计算新的位置创建新的图像并提取第二个图像的变量到新的图像
  • ¥15 改算法,照着压缩包里边,参考其他代码封装的格式 写到main函数里
  • ¥15 用windows做服务的同志有吗
  • ¥60 求一个简单的网页(标签-安全|关键词-上传)
  • ¥35 lstm时间序列共享单车预测,loss值优化,参数优化算法
  • ¥15 Python中的request,如何使用ssr节点,通过代理requests网页。本人在泰国,需要用大陆ip才能玩网页游戏,合法合规。
  • ¥100 为什么这个恒流源电路不能恒流?
  • ¥15 有偿求跨组件数据流路径图
  • ¥15 写一个方法checkPerson,入参实体类Person,出参布尔值