已为小白,啥都不懂 2022-01-11 09:29 采纳率: 98%
浏览 97
已结题

select选择器联动过滤的问题

img


当我选择下拉框的时候,点击全部或者外部机构或者全部机构的时候,旁边机构的下拉框里面的值会发生变化,我应该怎么操作来实现,

img

我现在已经将所有医院的ID合并到一个数组中去了,this.cc

img


加一个change事件,当我选择外部机构的时候,显示的id为
![img](。其他的数据全部隐藏
当我选择全https://img-mid.csdnimg.cn/release/static/image/mid/ask/642716078146154.png "#left")
部机构的时候则为
![img](,其他的数据 全部隐藏
当我选择了全部的时候https://img-mid.csdnimg.cn/release/static/image/mid/ask/247326078146182.png "#left")
则为全部医院id,也就是this.cc

img

  • 写回答

2条回答 默认 最新

  • 归来巨星 前端领域新星创作者 2022-01-11 10:30
    关注

    你如果用 select 来进行联动的话就是这样的一个逻辑

      <template>
        <div>
          demo1:
          <el-select v-model="value1" 
                     @change="change"
                     placeholder="请选择">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
          demo2
          <el-select v-model="value2" placeholder="请选择">
            <el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value">
            </el-option>
          </el-select>
        </div>
      </template>
    
        data() {
          return {
            options: [{
              value: '选项1',
              label: '黄金糕'
            }, {
              value: '选项2',
              label: '双皮奶'
            }, {
              value: '选项3',
              label: '蚵仔煎'
            }, {
              value: '选项4',
              label: '龙须面'
            }, {
              value: '选项5',
              label: '北京烤鸭'
            }],
            value1: '',
            value2:''
          }
        },
      methods:{
        change(data){
          console.log(data)
          if(data=='选项1'){
            this.value2 = '选项1'
          }else{
            this.value2 =''
          }
          
        }
      }
    
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

问题事件

  • 系统已结题 1月19日
  • 已采纳回答 1月11日
  • 修改了问题 1月11日
  • 创建了问题 1月11日

悬赏问题

  • ¥15 微信会员卡等级和折扣规则
  • ¥15 微信公众平台自制会员卡可以通过收款码收款码收款进行自动积分吗
  • ¥15 随身WiFi网络灯亮但是没有网络,如何解决?
  • ¥15 gdf格式的脑电数据如何处理matlab
  • ¥20 重新写的代码替换了之后运行hbuliderx就这样了
  • ¥100 监控抖音用户作品更新可以微信公众号提醒
  • ¥15 UE5 如何可以不渲染HDRIBackdrop背景
  • ¥70 2048小游戏毕设项目
  • ¥20 mysql架构,按照姓名分表
  • ¥15 MATLAB实现区间[a,b]上的Gauss-Legendre积分