DrowningFisher-CSDN博客

原创 js将列表遍历成树形结构

//递归方法生成 json tree 数据 getJsonTree(data, pid) { var result = [], temp; for (var i = 0; i < data.length; i++) { if (data[i].pid == pid) { var obj = {"title": data[i].title,"id":...

2020-09-23 11:02:39 1058

原创获取树形结构中的值作为新的数组返回，将树形数据转化为列表

// 返回以id组成的数组 deepTraversal(data) { const result = []; data.forEach(item => { const loop = data => { result.push(data.id); let child = data.children ...

2020-09-23 10:58:10 651

为了防止重复，或者恶意点击查询接口，可以对方法进行定时拦截，在1秒内重复点击只访问一次接口，在网上找了很多关于防抖节流的方法基本如出一辙，我对其中一个进行了改造// tools.jslet timeout = null;function VueDebounce(fnName, time, that) { return function() { if (timeout) { clearTimeout(timeout); }

2020-09-09 22:20:48 542

原创 el-table 懒加载重置加载状态

由于业务需求，大量的上下级关系管理，使用了el-tale树形懒加载，但使用过程中出现了以下三个问题1.删除时表格没有更新子级的数量2.新增时也没有加载新的数据3.使用this.$set(this.$refs.tabable.store.states.lazyTreeNodeMap,this.form.parentId, data)更新了视图，但是父级上面的数量统计没有更新这个办法基本可以解决问题 // 懒加载 load(tree, treeNode, r.

2020-09-09 22:05:33 3157

原创 flex布局在谷歌、火狐、360上正常，QQ浏览器上显示混乱

在浏览器IE，火狐，谷歌，360上使用flex布局都没有出现问题，但在QQ浏览器上运行时就出现了高度上的问题/* 父级 */.charts-box{ flex-grow: 1; width: 100%; height: 100%;}.charts-tit-box{ height: 50px; width: 100%; display: flex; font-size: 12px;}.charts-content-box{ fle

2020-08-05 18:05:45 1628

原创前端js字符串与数组常用方法

//js 字符串常用方法//查询let str= "abcd";str.indexOf("b"); //存在返回下标不存在返回-1str.includes("b"); //存在为true，不存在为false//替换let newstr = str.replace(/ab/g, "ba"); //newstr = bacd//字符串转数组let arrStr = "a-b-c";console.log(arrStr.split('-')); // ["a", "b", .

2020-07-29 20:02:55 465

原创 element-ui树形组件懒加载+分页加载

1.使用基本用法用data作为树形组件的数据2.使用load懒加载3.使用el-pagination这种用法只是规避了load的第一层加载，使用自己定义的方法获取第一层数据 //懒加载方法 load(node, resolve){ if(node.level === 0){ return; }else{ //请求 .

2020-07-21 17:07:15 3511

原创 element-ui树形组件懒加载一直出现默认加载问题

其实树形组件懒加载跟基础用法还是有点区别的基本用法是需要用到data但是懒加载不需要用到data，而是用resolve的形式返回数据，如果懒加载在<el-tree></el-tree>里面使用了data，那么就会一直出现一个默认加载问题。官方文档上例子是有，但是并没有直接说不需要data.官方案例里面用的是node.level === 0 ，其实这个就是加载第一层的分支，会默认加载是因为tree初始化时执行了此方法，所有一直会报一个错，只要把请求第一层的方法在 node.l.

2020-07-21 16:14:20 3605

原创 vue 路由跳转新窗口的方式

第一种<router-link tag="a" target="_blank" to="/newPage"> 新页面</router-link>vue2.0以后router.go和router.push就不支持新窗口打开的属性了，现在用一种新的方式router.resolvelet routeData = this.$router.resolve({ ..

2020-07-14 11:53:22 246 1

原创 element-ui 表格合并行实现

1、获取合并行数组如：[2，0，1，2，0，0] 如何获取呢，我自己写了个方法 //获取合并行数组 getColumnArray( name){ let spanArray = new Array(this.tableData.length).fill(0); // 从表格中获取字段作为数组 let arr = this.tableData.map(a => a[name]) ; ...

2020-05-30 10:25:57 1296 2

原创 element-ui 树形表格无法全选问题

当表格不是树形结构是，全选是没问题的，但是当有了children时，全选就出现问题了，无法选中子级，我的业务逻辑是1.表头全选状态时，所有子级要选中2.选中父级时，所有子级要选中3.父级旁边要有取消子级按钮，取消子级时，至选中本级 <el-table :data="deptDableDataT size='mini' border v-loading="loading

2020-05-27 23:34:15 2265

原创 element-ui 树形表格展开行问题

关于el-table 的展开行问题，其实官网写的也很详细，但有些情况下，列表数据量又很大，一次性加载出来的话，浏览器会出现卡顿，但需求是又没办法默认关闭全部，需要展开一级或者二级。这里有个偷懒的方案就是获取到展开的按钮，列表加载完时，点击展开按钮： this.$el.getElementsByClassName('el-table__expand-icon')[i].click(); 可以循环点击事件，我的需求是需要默认展开第一级...

2020-05-27 23:19:18 2520

原创 vue 使用font-awesome 库

下载npm install less less-loader css-loader style-loader file-loader font-awesome -s引入：import 'font-awesome/css/font-awesome.min.css'

2019-06-25 16:11:11 188

原创 vue 引入jquery与boostrap

1.首先使用导入jquery npm install jquery -s 在项目下的文件夹build中的webpack.base.conf.js文件，module.export 中加入 plugins: [ new webpack.optimize.CommonsChunkPlugin('common.js'...

2019-05-22 10:05:38 138

原创手机端带图片的选项卡

选项卡 *{margin: 0px; padding: 0px; text-decoration: none; list-style: none;} body{max-width: 640px; min-width: 320px; width: 100%; height: 100%; margin: 0px auto;} .tab-list{w

2018-04-11 09:50:58 384

原创 html手机端画板

<!DOCTYPE html><html><head> <meta charset="utf-8"> <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no&

2018-04-11 09:41:17 845

淹死的鱼的博客