How to implement this function with element ui?

clipboard.png
how to realize that autofocus always exists when the other two buttons are not clicked, and
is now in a state where there is no blue focus with one click elsewhere on the page

<el-row style="paddingTop:5px">
    <el-button autofocus style="marginLeft:50px" plain round size="mini" @click="checkSpecisesTab("")"></el-button>
    <el-button plain round size="mini" @click="checkSpecisesTab("1")"></el-button>
    <el-button plain round size="mini" @click="checkSpecisesTab("0")"></el-button>
</el-row>

write your own button. Control


with css
border-color: -sharp42a5f5; color: -sharp42a5f5;

put these two style on the buttons you want to effect


can actually change the way of thinking (save the nation by curve). You can use element ui's el-radio-group and el-radio-button, as long as you change the css style, and you don't have to deal with the problem of automatic focus (lazy and easy)


the first one is active: {border-color:-sharp42a5f5; color:-sharp42a5f5; by default. }
Click the name of the class that added active


Control type 1, 2, 3
Control the active color and list data according to 1, 2, 3

Menu