老街一角 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日

悬赏问题

  • ¥20 关于#硬件工程#的问题,请各位专家解答!
  • ¥15 关于#matlab#的问题:期望的系统闭环传递函数为G(s)=wn^2/s^2+2¢wn+wn^2阻尼系数¢=0.707,使系统具有较小的超调量
  • ¥15 FLUENT如何实现在堆积颗粒的上表面加载高斯热源
  • ¥30 截图中的mathematics程序转换成matlab
  • ¥15 动力学代码报错,维度不匹配
  • ¥15 Power query添加列问题
  • ¥50 Kubernetes&Fission&Eleasticsearch
  • ¥15 報錯:Person is not mapped,如何解決?
  • ¥15 c++头文件不能识别CDialog
  • ¥15 Excel发现不可读取的内容