element按钮默认选中

需求:第一个按钮默认选中,点击其他按钮则变成选中状态

查看全部为默认选中,点击只看A/B时,其余按钮变成未选中状态,开始想用autofocus属性,发现只有第一次有效,页面刷新时就会失去焦点。于是换了一种方式,通过改plain属性的方式,实现选中效果
在这里插入图片描述

 <el-button
              type="primary"
              size="mini"
              @click="reset"//点击事件,
              :plain= "select"//控制是否朴素按钮
              >查看全部</el-button
            >
            <el-button
              type="primary"
              size="mini"  
              @click="selsectB"
               :plain= "selectB"
         
              >只看B</el-button
            >
            <el-button
              type="primary"
              size="mini"
               :plain= "selectA"
              @click="selsectA"
         
              >只看A</el-button
            >

data里定义
      select:false,
      selectA:true,
      selectB:true,

方法里定义
search() {
      this.init(1);//页面刷新
    },
    selsectB() {
      this.queryForm.suggestChange = "B";
      this.init(1);
      this.select=true
      this.selectB=false
      this.selectA=true
    },
    selsectA() {
      this.queryForm.suggestChange = "A";
      this.init(1);
      this.select=true
      this.selectA=false
      this.selectB=true
    },
   


评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值