ElementUI中el

2024-07-01 15:45| 来源: 网络整理| 查看: 265

场景

在el-select的下拉框中，下拉选择指定的下拉项时才会显示后面的单选框，否则不显示。

效果如下

实现

首先在页面中添加这两个控件

井下大班井下小班

然后设置要动态显示的单选框控件的v-if="isJxBc"来控制其显示和隐藏，其中isJxBc是一个布尔变量。

需要提前声明

isJxBc: false,

然后在前面下拉框中设置change事件@change="bclxChange"

在change事件中

bclxChange(selectValue) { if (selectValue == 1) { this.isJxBc = true; } else { this.isJxBc = false; } },

判断选中项的值是否为1,1就代表选中的是井下班制即要显示后面的单选框的下拉选项。

数据来源是bclxOptions构建的对象数组

下拉框的值选的是dictValue，下拉框显示的内容是dictLabel。

【本文地址】

公司简介

联系我们