van-checkbox-group 单选组

 

 样式行,实际不行

<van-checkbox-group v-model="selectItems" @click="selectItemsFn">
                <div class="flexa w">
                  <van-checkbox
                    v-for="(item, index) in tableData"
                    :key="index"
                    :name="item"
                    >{{ item }}
                  </van-checkbox>
                </div>
              </van-checkbox-group>
   tableData: ["人员", "单位"],
      selectItems: [],

 正确的写法

<div class="flexa w mt10">
                <van-checkbox
                  @click="selectItemsFn(index)"
                  v-model="item.checked"
                  class="ml20"
                  v-for="(item, index) in typeOptions"
                  :key="index"
                  :name="item.value"
                  >{{ item.label }}
                </van-checkbox>
              </div>
  selectItemsFn(index) {
      if (!this.typeOptions[index].checked) {
        this.typeOptions[index].checked = true;
      }
      this.typeOptions.map((item) => {
        item.checked = false;
      });
      this.typeOptions[index].checked = true;
      this.formData.type = this.typeOptions[index].value;
    },
   typeOptions: [
        {
          label: "人员",
          value: 1,
        },
        {
          label: "单位",
          value: 2,
        },
      ],

 

posted @ 2024-12-09 09:28  ThisCall  阅读(6)  评论(0编辑  收藏  举报