这是我参与新手入门的第2篇文章

前言 在项目中，遇到多选框表格数据，一般都会用element-ui组件库，但官网默认标题内容是多选框样式，是可以便捷地实现数据的全选与取消选择的功能封装，但如图所示，项目中有可能需要自定义标题内容，不想要全选功能，那要怎样实现呢？

官网多选框关键代码如下：设置type类型为'selection'本列就是多选框的样式

    <el-table-column
        type="selection"
        width="55">
    </el-table-column>

更改思路：

elementUI通过指定Table组件的row-class-name属性来为Table中的某一行添加class改变该行的颜色等样式。
1.通过添加类名，隐藏默认多选框样式
2.利用伪元素，将内容定位到图标位置即可
(注意点：因为是更改封装组件样式，所以需要用到深度作用选择器，本文用的/deep/)

话不多说，附上更改代码：

……
    <el-table-column
        type="selection"
        label-class-name="DisabledSelection"
        width="55">
    </el-table-column>
……         
<style lang="less" scoped>
    div.main {
        //关键样式 修改内容
        .el-table /deep/ .DisabledSelection .cell .el-checkbox__inner {
            display: none;
            position: relative;
        }
        .el-table /deep/ .DisabledSelection .cell:before {
            content: '选择';
            position: absolute;
            right: 20px;
        }
    }
</style>

这里是把多选框图标换成了"选择"文本，大家根据需求替换文本样式即可

来掘金第二天了，喜欢的话麻烦点个赞再走呗，希望小伙伴们多多支持呀，共同进步！