vue——笔记

1、前端取到数组以后只需要取数组里的某一个值，
遍历数组

//遍历数组dataForm
 let data = this.dataForm.map(c => {
		return parseInt(c.id);     //BigDecimal类型转换为Int类型
});

2、级联选择器点击重置按钮清空已选择的内容（如图所示效果）

 <el-cascader
                                v-model="id"
                                :props="defaultParams"
                                :options="options"
                                placeholder="请选择"
                                @change="handleChange">
                        </el-cascader>

当选中节点变化时触发handleChange方法

handleChange(id) {
            id= id[id.length-1];  //取数组的最后一位
        },

下面是重置清空的方法

 _reset() {
            //清空查询条件
            this.id = [];
        },

关键是一定要写v-model,然后将绑定的v-model清空就行。

3、ElementUi 表格取消全选框（效果如图）

 <el-table
                            ref="multipleTable"
                            :data="page.records"
                            highlight-current-row
                            @current-change="handleCurrentChange"
                            @selection-change="selectionChangeHandle"
                            :row-class-name="tableRowclassName"
                            :header-cell-class-name="cellClass"
                            height="220" style=" margin-top:20px; width:99%;"
                    >
                        <el-table-column  type="selection"  width="100"  ></el-table-column>
                        <el-table-column label="电缆线名称" prop="name" width="150"></el-table-column>
                        <el-table-column label="所属线路" prop="feederName"></el-table-column>
                        <el-table-column label="长度(m)" prop="length"  width="100"></el-table-column>
                    </el-table>

具体实现方法，这个方法主要就是给表格所需要的列添加类名
（cellClass()方法主要给复选框那一列添加 类名为 ‘disabledCheck’）

<el-table  :header-cell-class-name="cellClass"></el-table>
cellClass(row){     
    if (row.columnIndex === 0) {           
     return 'disabledCheck'     
    } 
},

CSS样式设置如下

/* 去掉全选按钮 */
.el-table .disabledCheck .cell .el-checkbox__inner{
    display: none !important;
}

.el-table .disabledCheck .cell::before{
    content: '选择';
    text-align: center;
    line-height: 37px;
}

原文链接来自：https://www.cnblogs.com/JinXinYuan/p/12165027.html

4、elementui带单选框的表格
https://www.cnblogs.com/calamus/p/8569196.html

https://www.jianshu.com/p/63d70324abfc

5、elementui表格使用checkbox实现单选效果

https://blog.csdn.net/qq_36718999/article/details/92773919

6、element-ui的table表格的多选框默认选中
https://blog.csdn.net/u010007013/article/details/97828405

7、element-ui trr树形结构点击当前背景再点击其它地方会消失问题解决，以及修改当前背景色。

https://blog.csdn.net/weixin_44903107/article/details/105513492

8、前端Vue中常用rules校验规则

https://www.cnblogs.com/lieone/p/11856330.html

9、elementUI属性：

1）table 表格中参数过长省略并且提示显示：
:show-overflow-tooltip=“true” 或者 show-overflow-tooltip