Element-ui checkbox component, how to click on one, the rest disabled?

as shown in figure

clipboard.png

I want to disable the other two options after selecting "Front". Cancel or "Front" before you can select the other two options. similarly, if you select another option, disable the remaining two options.

the vue+element-ui is used for the project. Please advise.
ps (disable effect to be used by the product, I would also like to use the checkbox)

Apr.01,2021

violent practices: https://jsfiddle.net/08o1th5y.

by the way, you can only choose one why you don't use the radio box instead of using the multi-selection simulation single


can't you use radio?


Why don't you use the checkbox? < el-radio > chose one of the other disabled. If you have to use multiple selections, bind the disabled properties of each box to the data and activate the unselected disabled attributes in the selected event.
is also recommended to be changed to a single option.

Menu