Element UI 问题收录 持续更新

目录

1. el-table + overflow-y: auto ，本想让表格固定高度，溢出则出现滚动条，使用后table上却出现 行错位 的情况。

2. el-table 复选框列 根据当前行内的数据，进行动态灰化(不可选)

3. el-dialog 弹窗每次打开时，让起始位置恢复到初始位置

---

---

1. el-table + overflow-y: auto ，本想让表格固定高度，溢出则出现滚动条，使用后table上却出现 行错位 的情况。

解决方法：

1. 在 el-table 外侧套一个div，在div上设置 overflow-y: auto + 高度

扫描二维码关注公众号，回复： 15108832 查看本文章

2. 可使用 Element UI 提供的（el-table元素中定义了height属性）方法，这个可以固定表头，看下方截图

管网地址：

2. el-table 复选框列 根据当前行内的数据，进行动态灰化(不可选)

在 复选框列元素上 ，加 selectable 属性，根据这个属性的结果，进行动态判断 。 (点击全选时，选不上灰化的复选框)

<el-table>
    <el-table-column type="selection" :selectable="handleSelecTable"></el-table-column>
</el-table>

methods: {
    /*
    * 仅对 type=selection 的列有效，
    * 类型为 Function
    * Function 通过返回 Boolean 类型的值，决定这一行的 CheckBox 是否可以勾选
    * Function(row, index)
    */
    handleSelecTable(row,index){
        if(row.kubun == 0){
            return false;
        }
        return true;
    },
}

3. el-dialog 弹窗每次打开时，让起始位置恢复到初始位置

因为弹窗内的内容较多，导致出现了滚动条，弹窗每次关闭打开后，位置是上次关闭时的位置。下面代码是利用 ref 以及 watch 实现。

<el-dialog ref="dialog" :visible="sinseiEditVisiable">

watch: {
    sinseiEditVisiable () {
        if (this.sinseiEditVisiable) {
            this.$nextTick(()=>{
                this.$refs.dialog.$el.scrollTop = 0;
            })
        }
    }
}