:disabled="scope.row.status === 1 || scope.row.status === 2 || scope.row.status === 3"
时间: 2023-11-23 12:54:01 浏览: 51
这段代码的作用是禁用一个按钮,当`scope.row.status`的值为1、2或3时。也就是说,只有当`scope.row.status`的值为0时,按钮才是可点击的。这是因为使用了逻辑或`||`,只要有一个条件满足,整个表达式就是true。而正确的做法是使用逻辑与`&&`,只有所有条件都满足时,整个表达式才是true,按钮才是可点击的。因此,正确的代码应该是:`disabled="scope.row.status !== 0 && scope.row.status !== 1"`。
相关问题
<template slot-scope="scope"> <el-form-item :prop="'list.' + scope.$index + '.controlok'" :rules="fromDataRules.controlok" > <el-input v-if="scope.row.controluse === 'S2F21'" :disabled=" scope.row.iscontrol === false || scope.row.iscontrol == null || scope.row.iscontrol == '' " v-model="scope.row.controlok" filterable clearable /> <el-select v-else v-model="scope.row.controlok" :disabled=" scope.row.iscontrol === false || scope.row.iscontrol == null || scope.row.iscontrol == '' " :placeholder="t('web_ems_tip_pleaseInput')" filterable clearable > <el-option v-for="item in identifyingList" :key="item.id" :label="item" :value="item" /> </el-select> </el-form-item> </template>中表单验证controlok: [{ validator: checkPass, trigger: "blur" }],checkPass方法中怎么获取到该行数
可以通过传入参数的方式获取到该行数。在定义checkPass方法时,可以在参数中传入当前表单项的值和当前表单项的索引。例如:
```
checkPass(rule, value, callback, index) {
// index即为当前表单项的索引
// 可以根据索引来获取到该行数
const row = this.list[index];
// ...
}
```
在模板中调用该方法时,需要将当前表单项的索引作为参数传入:
```
<el-form-item
:prop="'list.' + scope.$index + '.controlok'"
:rules="fromDataRules.controlok"
>
<el-input
v-if="scope.row.controluse === 'S2F21'"
:disabled="
scope.row.iscontrol === false ||
scope.row.iscontrol == null ||
scope.row.iscontrol == ''
"
v-model="scope.row.controlok"
filterable
clearable
:class="{ 'is-invalid': errors['list.' + scope.$index + '.controlok'] }"
/>
<el-select
v-else
v-model="scope.row.controlok"
:disabled="
scope.row.iscontrol === false ||
scope.row.iscontrol == null ||
scope.row.iscontrol == ''
"
:placeholder="t('web_ems_tip_pleaseInput')"
filterable
clearable
:class="{ 'is-invalid': errors['list.' + scope.$index + '.controlok'] }"
>
<el-option
v-for="item in identifyingList"
:key="item.id"
:label="item"
:value="item"
/>
</el-select>
</el-form-item>
```
可以看到,在el-input和el-select中都有一个:class绑定,用来判断当前表单项是否验证通过,如果不通过,则添加一个is-invalid类名,可以在样式中对该类名进行样式设置。同时,在prop中也需要将当前表单项的索引作为属性名的一部分。这样,在定义checkPass方法时,就可以通过该属性名来获取到该行数的值。
<el-table-column label="值"> <template slot-scope="scope"> <el-select class="custom-select" multiple collapse-tags style="margin-left: 30px;" v-if="scope.row.name == 'ParamType'" v-model="scope.row.data" > <el-option v-for="t in scope.row.valueData" :key="t.text" :label="t.value" :value="t.text" > </el-option> </el-select> <el-input v-else v-model="scope.row.data" :disabled="scope.row.name == 'Protocol'" ></el-input> </template> </el-table-column>
根据你提供的代码,多选框的显示问题可能与以下几个因素有关:
1. `el-select` 组件的样式:你可以尝试调整 `el-select` 组件的宽度,以确保能够完整显示所有已选择的数据。你可以通过在 `el-select` 标签上添加 `style` 属性来设置宽度,例如 `style="width: 200px;"`。
2. 父级容器的宽度:如果 `el-select` 组件的父级容器宽度不足以容纳所有已选择的数据,那么显示框就会被截断。你可以检查父级容器的宽度,并根据需要进行调整。
3. 其他样式或脚本冲突:有时候,其他样式或脚本可能会影响多选框的显示效果。你可以检查是否有其他样式或脚本与 `el-select` 组件冲突,如果有的话,尝试解决冲突问题。
希望以上建议能够帮助你解决多选框显示不完整的问题。如果还有其他疑问,请随时提出。