- 博客(34)
- 收藏
- 关注
原创 es6手写promise
const pending = 'pending' const fulfilled = 'fulfilled' const rejected = 'rejected' class PromiseHandle { constructor(executor) { // 立即调用函数 try { executor(this.resolve, this.reject) } catch (err) { this.reject(err) } } status..
2022-02-17 10:36:45 448
原创 es5手写primise
function MyPromise(executor) { this.status = 'pending' this.result = undefined; this.resolveCallback = [] this.rejectCallback = [] resolve = (data) => { if (this.status !== 'pending') return if (this.status === 'pending') { this.status = 'f.
2022-02-14 15:40:35 187
原创 vue 中filters转换后台获取的数据字典
实际开发应用中,后端传给我们都是0,1,2,3等key值,前端要根据key值转换成lable值,这里用filters就比较合适,没有改变原数据,只在视图上体现;全局filters使用// 全局filters定义const filters = { // 数据字典转换 fmtText(value, arr) { let textArr = arr.filter(item => item.datacode == value); return textArr.length > 0
2022-01-19 15:30:04 2509
原创 Vue 中mixins混入实际开发项目运用
1、mixins混入,混入 (mixin) 提供了一种非常灵活的方式,来分发 Vue 组件中的可复用功能。一个混入对象可以包含任意组件选项。当组件使用混入对象时,所有混入对象的选项将被“混合”进入该组件本身的选项。api都有介绍,这个不做过多介绍管理系统有很多表格增删改查,每个都写一边,造成代码冗余,且不利用维护,所以我把公共的数据方法抽离出来复用,这里面有表格数据、分页操作、增删改查操作,把接口定义在使用页面中;如下公共mixins对象定义如下实际运用界面,import该mi...
2022-01-19 15:17:27 681
原创 vue组件化开发分页插件,支持页码、配置各个显示
自己动手写了一个分页插件,借鉴了element-ui分页,有不足,请多多指教哦,效果图如下,样式没加修饰,有空再优化优化使用页 <gd-pagination :pageSize.sync="pageSize" :currentPage.sync="currentPage" :total="total" :page-sizes="[2, 3, 4, 5]" layout="total, sizes, prev, pa..
2022-01-14 14:37:00 1157
原创 基于element-ui二次封装树Tree组件,可以新增修改删除重命名树节点
采用组件化开发进行二次封装;效果如下:使用页代码如下:<template> <div class="gd-tree"> <eleTree :data.sync="newData" :fileDrop="fileDrop" :diectoryDrop="diectoryDrop" :delete="deleteBtn" :edit="editBtn" ></el.
2022-01-14 14:26:36 2145
原创 vue开发组件库步骤
1.安装脚手架 创建项目npm install -g @vue/clivue create garden-ui安装中sass-loader、node-sass报错因为版本过高,删除低版本,安装低版本即可npm install sass-loader@5 -Dnpm install node-sass@4 -D
2022-01-12 09:45:29 373
原创 gulp-sass打包scss文件中报错Error in plugin “gulp-sass“Message:
单独安装 gulp-sassnpm install sass gulp-sass --save-dev在gulpfile.js文件中配置const gulp = require('gulp');// const sass = require('gulp-sass'); var sass = require('gulp-sass')(require('sass'));//sass-css我的gulpfile.js配置如下const gulp = require('gul..
2021-12-31 11:46:35 608
原创 Vue项目webpack打包报错:Can‘t resolve ‘/components/lib/alert/src/alert‘
const path = require('path')const { VueLoaderPlugin } = require('vue-loader')const glob = require('glob');const list = {}async function makeList(dirPath, list) { const files = glob.sync(`${dirPath}/**/index.js`) for (let file of files) { const com.
2021-12-30 16:03:09 1202
原创 echart柱状图堆列实现百分比显示
let xAxisValue1 = [63, 89, 44, 34, 3, 98];let xAxisValue2 = [23, 89, 44, 34, 3, 98];option = { legend: { data: ['退出项目', '未退出项目'], bottom: 0 }, title: { text: '已退出项目占比', x: 'center', textAlign: 'center' }, tool.
2021-12-17 15:36:45 1930
原创 手写primoseAll
核心思路1.Promise.all()方法最终只返回一个promise对象,所以要直接写一个return new Promise((resolve,reject)=>{})2.Promise.all()方法接收的是一个可遍历的数组,输入的promise的reslove回调结果是一个数组;3.已经使用promise.resolve(),包裹一层,使其返回一个promise对象,何时将结果返回出来呢?定义了计数器,如果内部promise计数加起来等于计数器的数量,这个时候,就可以将结...
2021-12-17 15:31:06 82
原创 echart柱状图堆列实现百分比显示
let xAxisValue1 = [63, 89, 44, 34, 3, 98];let xAxisValue2 = [23, 89, 44, 34, 3, 98];option = {legend: {data: [‘退出项目’, ‘未退出项目’],bottom: 0},title: {text: ‘已退出项目占比’,x: ‘center’,textAlign: ‘center’},toolbox: {},color: [‘rgb(116,142,222)’, ‘#AD6D6.
2021-12-17 11:22:29 591
原创 echart柱状图显示两个数值、显示百分比,中间和头部显示两个数值
const xAxisValue = [51, 58, 53, 31, 32, 34, 51, 58, 53, 31, 32, 34]; function fomatPercent(data) { let sum = 0; xAxisValue.map((item) => { sum += item; }); return Math.round...
2021-12-16 15:51:24 3374
原创 Git常用命令
1.git checkout -b syy //添加新分支2.git branch//查看分支3.本地有修改, 但是想更新服务器上代码1. 首先将本地修改stash git stash2. 拉取最新代码 git pull3. 弹出之前的修改 git stash pop切换分支命令# 切换远程分支,切换远程的v1分支到本地, 本地分支名称叫v1git checkou...
2019-09-03 15:52:12 88
原创 js提交文件或图片,同时提交到2个服务器上
使用element,<el-upload class="upload-demo" :action="url_action_Cont" :on-preview="handlePreview":on-remove="handleRemove" :on-success="onsuccess" :ref="fileList"accept=".doc,.docx,.pdf,.png":...
2019-08-14 14:32:05 211
原创 vue点击空白区域,下拉列表隐藏
//模板部分<i class="el-icon-menu mb_icon" @click="mb_menu" ref="mbMenu"></i>//js部分放在mountd里:document.addEventListener('click', (e) => {if (!this.$refs.mbMenu.contains(e.target)) {...
2018-12-12 11:45:07 3511
原创 redux使用@connect装饰器
使用connect装饰器需要安装 npm install --save babel-plugin-transform-decorators-legacynpm install @babel/plugin-proposal-decorators --save-dev然后npm run eject 弹出个性化配置 或是create-react-app之后就运行eject"babel...
2018-11-22 17:57:04 565
原创 redux入门笔记
下载安装依赖包:npm install --save redux使用react-redux:npm install --save react-redux redux异步编程:npm install --save redux-thunk搭建redux,redux-saga需安装依赖包:npm install --save redux-saganpm install --save...
2018-11-22 17:56:31 108
原创 react路由跳转使用 this.props.history.push('/app')
react路由跳转使用 this.props.history.push('/app');使用withRouter包裹connect,实现跳转的问题;export default withRouter(connect(mapStateToProps)(OpenAccountContainer))
2018-11-07 15:38:33 10905
原创 react中,将HTML标签字符串解析成dom插入到html中 ,使用dangerouslySetInnerHTML
1.将内容通过键值对的形式写入_html中,注意是2个括号;2.给匹配的词加上<span>标签;item.detail = item.detail.replace(new RegExp(searchText,'g'),'<span>'+searchText+'</span>');return(<p dangerouslySetInne...
2018-11-05 15:12:25 4805
原创 使用react+ant design左侧导航默认选中和展开
1.<Menu theme='dark' mode='inline' selectedKeys={[selectedKey]} onClick={this.menuClick} onOpenChange={this.onOpenChange}openKeys={[openKey]}</Menu>2.this.state = {selectedKey: this.pro...
2018-11-01 15:49:56 12148
原创 父组件向子组件传值
父组件: 注意一点,这个 :numy = “” 一定要是双引号,单引号不起作用<cnode-head @getChild="hidePanel" :numy="tr"></cnode-head>子组件:{{numy}} //可以直接使用了export default{ props:['numy']}...
2018-07-06 18:07:42 231
原创 Vue子组件向父组件传值
父组件:<head @getChild = "hidePanel"></head>在methods里加上hidePanel(data){//进行操作 }子组件: <li> <a href ='javascript:void(0)' @click ='hidePanelu'>平台公告</a> </li..
2018-07-06 17:29:43 697
原创 将当前节点挂在父节点的后面
将当前节点挂在父节点的后面 var data = [{ id: 11, code: null, name: "原始库", pid: 0, sort: 1, delFlag: 1, remark: null, createBy: null }, { ...
2018-07-02 11:07:40 287
原创 将tree的树结构,按顺序拆分成平级数据
将tree的树结构,按顺序拆分成平级数据<script> var json = { id:'1', pid:'-1', children:[{ id:'1_1', pid:'1' },{ id:'1_2', pid:'1', children:[{ id:'2_1', pid:'1_2' },{ id:'2_...
2018-07-02 09:48:35 2422
原创 ztree新增的new node默认选中可编辑状态
var treeObj=$.fn.zTree.init($("#treeDemo"), setting, zNodes); treeObj.expandAll(true);//展开全部 var nodes = treeObj.getNodes(); if(switchG == true){ doFindId(nodes...
2018-06-29 14:38:02 1445
原创 ajax传数组字符串有冒号,解决ie的请求的缓存问题
ajax传数组字符串有冒号:一定要加上 contentType: "application/json"; 解决ie的缓存问题:cache: false, 将数组转换成字符串: JSON.stringify(arr) $.ajax({ dataType: "json", type: "post", ca...
2018-06-29 14:32:52 541
原创 ztree拖拽排序
先给树结构newList排序:zNodes= newList.sort(compare('sort'));ztree的拖拽函数beforeDrop ,根据拖拽的类型,inner,prev,next分别处理 function beforeDrop(treeId, treeNodes, targetNode, moveType) { var treeObj=$.fn.zTree.i...
2018-06-29 14:26:57 1597
原创 前端实现导出以及下载
1.使用a标签跳转,触发a标签的click事件,提交function exportFile(item){ var url =http+"/interface/exportApp?interfaceName="+interfaceName+"&startDate="+startDate+"&overDate="+overDate+"&pageNo="+pageN...
2018-06-20 09:49:20 745
原创 ztree的addHoverDom针对性的显示新增删除和修改
配置setting内的edit节点的showRemoveBtn,showRenameBtn属性,返回一个函数的形式,如果正常显示,则为true,否则为false;var setting={edit:{showRemoveBtn: zTreeshowRemoveBtn,showRenameBtn: zTreeshowRenameBtn,}}...
2018-06-18 15:09:50 2523
原创 layer的CheckBox根据后台获取的值默认选中
$("#XXX").prop('checked',true);form.render() //重新渲染
2018-06-15 18:14:08 4028
原创 javascript 对象转化成变量使用
本来设置了几个变量名,用eval()转化,发现不可以,定义成一个对象,改变属性的方法,来改变变量var viewObj = { is_primary_key:'', is_foreign_key:'', is_index:'', is_time_stamp:''} for(i in viewRecord){ assigNment(i,view...
2018-06-15 14:31:08 507
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人