![](https://img-blog.csdnimg.cn/20201014180756926.png?x-oss-process=image/resize,m_fixed,h_64,w_64)
解决问题
何其涛
我的qq:459069283 有什么问题可以加我,一起讨论学习!
展开
-
兼容所有浏览器的js简单手动复制粘贴文本方法
兼容所有浏览器的js简单手动复制粘贴文本方法因为比较简单所以就简短说三步:创建一个不显示在页面上的textarea/input标签将需要复制的值设置到标签的value属性上获取标签dom调用select方法选中所有内容,调用document.execcommand('copy')执行复制完事!其实就是模拟手动选中复制的操作代码://html<textarea value=...原创 2020-04-09 20:00:51 · 1205 阅读 · 0 评论 -
父元素内多个子元素,子元素根据内容确定高度,子元素和最高的子元素等高
父元素内多个子元素,子元素根据内容确定高度,子元素和最高的子元素等高父元素中有多个子元素,父元素高度不确定,子元素高度不确定以内容的高度确定,但是这时候要求子元素等高,也就是按照子元素中内容最多的那个元素的高度确定所有元素的高度,这种需求以普通的布局是很难实现的.<body> <div class="father"> <div class="child...原创 2019-02-27 19:04:32 · 1958 阅读 · 0 评论 -
ant design表单校验踩坑
antd的表单校验有很多预设规则,类型如下string: Must be of type string. This is the default type.number: Must be of type number.boolean: Must be of type boolean.method: Must be of type function.regexp: Must be an ...原创 2019-02-18 20:00:56 · 7541 阅读 · 2 评论 -
React中的函数式编程及函数式编程定义的深刻解读
React中的函数式编程及函数式编程定义的深刻解读因为一直有了解函数式编程,也知道React是比较遵循函数式编程设计模式的框架,但是一直对函数是编程的定义和理解不是很清楚,到底函数式编程有上面优势,React如何遵循函数是编程,这些都是需要去仔细推敲的,可以让以后的代码写的更为优雅和合理什么是函数式编程函数是编程是一种设计思想,就像面向对象编程也是一种设计思想。函数式编程总的来说就是用...原创 2019-02-13 22:35:04 · 4438 阅读 · 3 评论 -
JSON对象转成formData对象,formData对象转成JSON对象
在向后端请求时,如果上传的数据里存在file文件对象,需要用到表单提交,这时候我们需要将JSON对象,转成formData对象,具体见代码 Object.keys(params).forEach((key) =&amp;amp;gt; { formData.append(key, params[key]); });...原创 2019-02-14 15:53:16 · 29699 阅读 · 1 评论 -
ant design/react 利用setTimeout解决表单还未加载,动态校验的问题
ant design/react 利用setTimeout解决表单还未加载,动态校验的问题在写项目中出现一个问题,在表单中用一个A控件控制另一个B控件显示隐藏,当A控件切换的时候,同时校验B控件,这时候会出现B控件内就算有初始值也会检验报错, 因为当校验代码执行的时候,B控件还没有加载出来,因为两个操作都在同一个eventloop里.handleVisible() { this.set...原创 2019-03-05 18:59:32 · 1463 阅读 · 0 评论 -
ant design中 Select/Dropdown/DatePicker/TimePicker放在Modal中时,不更随model滚动
在使用ant design过程中发现,当再Modal中使用时,浮动的下拉菜单时间选择菜单等不随Modal的滚动而一起滚动,有时候会被部分遮挡.这是因为浮动层都是默认以body定位的,而Modal层滚动的时候body整体页面并没有滚动,所以导致浮动层不会跟随滚动. 解决方法就是使用Select中的getPopupContainer和DatePicker中的getCalendarContainer属...原创 2019-03-19 15:51:03 · 1991 阅读 · 0 评论 -
小程序get/post/上传文件请求用promise封装
小程序的wx.request没有对传过来的请求进行处理,对于各种状态进行处理,所以需要在代码里封装,这里是直接写app.jsl里的,get和post的封装.首先写通用headerheader header: { 'app_code': "DAFENGBAODAI", 'client': 'miniProgram', 'imei': 'idfv', ...原创 2019-03-07 18:45:28 · 1185 阅读 · 0 评论 -
兼容所有浏览器, 关闭记住密码的input的自动填充功能
当你在登陆页面选择了记住密码,会导致在后面修改密码的输入框中,直接自动填充密码.想要古娜彼自动填充.方法一:在表单中创建一个不显示的input且type等于password<input type="password" style="position: absolute;z-index: -999">由于密码直接填充到这个input中所以不会在真正的input上显示方法二...原创 2019-03-18 19:07:14 · 7507 阅读 · 4 评论 -
直白理解javascript中函数柯里化,偏函数,反函数柯里化
直白理解javascript中函数柯里化,偏函数,反函数柯里化因为之前有写过一篇理解函数式编程的,但是讲到函数式编程就必须提到函数柯里化, 函数柯里化是函数式编程中很常见的写法,这篇也是看了很多篇大佬的文章综合理解,下面是个人的一写简洁,希望能够更直白的理解上面这些定义函数柯里化定义官方定义: 是把接受多个参数的函数变换成接受一个单一参数(最初函数的第一个参数)的函数,并且返回接受...原创 2019-03-22 15:01:15 · 348 阅读 · 0 评论 -
TCP拥塞控制和流量控制区别含义深刻理解
TCP拥塞控制和流量控制区别含义深刻理解因为最近学习了TCP/IP协议,学习TCP其中内部的两个很大的特点,就是流量控制和拥塞控制两个优化数据传输的方法,因为两者有很多细节的知识,所以再这里记录一下,希望能很直白清楚的解释这两个概念,也方便记忆和理解.拥塞控制和流量控制是TCP用来解决传输数据中产生的一些问题,而采取的两种优化方法,两者作用上的区别流量控制是为了解决发送方和接收方速度...原创 2019-03-27 20:57:03 · 12395 阅读 · 1 评论 -
BizCharts多折线图字段别名,Tooltip和legnd分别设置
BizCharts多折线图字段别名,Tooltip和legnd分别设置项目中用到了BizCharts,但是多折线图的Tooltip浮动提示和legnd图例的字段名直接用的是字段的名字,但是字段名并不能直接设置别名,所以解决起来比较麻烦,需要在Tooltip和legnd中都设置模板,而字段名的类型是key, 文档不是很全,找了很长时间,所以记录一下Tooltip修改 <Geom ...原创 2019-04-01 14:14:22 · 6497 阅读 · 0 评论 -
React的onPaste必须点击一次元素才能起作用问题
React的onPaste必须点击一次元素才能起作用问题最近在封装一个图片组件的过程中,有一个需求是需要能够复制粘贴上传图片, 因为React中有自带的合成事件onPaste绑定事件,但是出现一个问题是, 鼠标直接放在上面,并不能触发onPaste事件 .使用了各种方法都不行 handlePaste = (e)=> { console.log(e) } ....原创 2019-04-10 19:33:40 · 1365 阅读 · 1 评论 -
React接收excel文件下载导出功能封装
React接收excel文件下载导出功能封装因为最近项目又需求要导出excel,所以封装了这部分的功能,对fetch的封装做了修改,使之后的调用导出功能更为方便首先这个项目请求是对fetch进行过封装的 ,如果对fetch有了解的话,我们知道fetch种response返回的是一个实现了Body接口的对象, 所以可以使用Body接口中的方法 json()处理json,blob ()处理成...原创 2019-04-25 15:47:09 · 3309 阅读 · 1 评论 -
子元素绝对定位跟随父元素overflowscroll滚动问题
子元素绝对定位跟随父元素overflowscroll滚动问题写项目的时候忽然遇到一个问题, 子元素固定定位,父元素设置 overflow:scroll超出部分滚动, 结果固定定位的元素仍然会随着滚动条滚动, 按照原先的理解,父元素内部滚动是不会影响固定定位的元素的原先代码样例:<div class="box"> <div class="child-1"><...原创 2019-07-21 20:31:44 · 14139 阅读 · 3 评论 -
react Context/Provider/Consumer传参使用
react Context/Provider/Consumer传参使用react context这个api很少用到,所以一直不太清楚如何使用,最近在看antd的项目源码时,发现在组件中有类似Template.Comsumer的写法,一时没反应过来,本着碰到不懂得都要追根究底的原则,下面好好学习一下,Context这个api的使用Context作用上下文(Context) 提供了一种通过...原创 2019-08-06 11:49:51 · 6417 阅读 · 0 评论 -
ant design中Select,Option动态加载,设置初始值无法默认选中项问题
一般遇到表单回显的问题的时候,会使用initialValue设置初始值 {form.getFieldDecorator('name', {initialValue:current.name})(<Input placeholder="请输入姓名" />)}但是发现动态加载的Option选项的Select,无法选中指定项,而是直接显示绑定的值,检测得到Option中的key必须是...原创 2019-02-27 17:37:23 · 13366 阅读 · 13 评论 -
dva中effect内调用另一个effect的,实现put阻塞式调用的方法
dva中effect内调用另一个effect的,实现put阻塞式调用的方法在项目中通常会有在一个effect中调用另一个effect的需求,实现方法就是直接使用put *a({ payload}, {put, call,take}) { try { console.log(a) yield put({type: 'b',payload: {}}...原创 2019-02-21 20:25:47 · 16328 阅读 · 1 评论 -
对Quill富文本插件上传图片修改,调整部分功能
对Quill富文本插件上传图片修改,调整部分功能因为之前项目中有用到富文本的功能,所以就去研究了一下,富文本插件也挺多 比较推荐的就是quill 和ckeditor ,貌似ckeditor功能更为全面也更大, 但是quill有适配vue的quill-vue版本,而且项目上需要的功能也不是特别复杂所以就选了quill,下面说一些对quill的适配修改吧 ,可能对第一次用人来说会比较蒙蔽.还有...原创 2018-10-31 22:21:42 · 7601 阅读 · 0 评论 -
vue中实现拖拽,复制粘贴操作获取上传图片
拖拽,复制粘贴操作获取图片因为最近项目需要实现一个图片组件,包含压缩,拖拽上传,复制上传,图片裁剪,兼容多图和单图上传功能,好像这类组件也比较少,所以自己就封装了一个,连带着相关知识也熟悉了。这里分开几篇写,下面说一下图片拖拽,复制粘贴获取文件首先复制粘贴是只支持微信qq或者钉钉上的截图的,而本地文件是不支持的,且复制粘贴不支持同时上传多张其次拖拽上传支持本地的文件,不支持截图的拖拽...原创 2018-11-12 19:07:33 · 7416 阅读 · 1 评论 -
Axios代理配置及封装响应拦截处理
Axios代理配置及响应拦截处理Axios是vue官方推荐的异步处理方案,所以在几个vue的项目里,都用到了,所以这里写一下Axios的代理配置和响应拦截处理代理配置代理主要是为了解决跨域问题,但是现在常规解决跨域的方式,就是让后端配置响应头,使用cors方式跨域前端基本不需要任何处理。但是有时候后端比较懒,就需要前端通过代理请求完成跨域,其实就是相当于在本地开了一个服务器,通过服务器...原创 2018-11-29 11:55:18 · 1954 阅读 · 0 评论 -
图片居中等比缩放且填充div
图片居中等比缩放且填充div因为经常会有这种需求,需要等比将图片缩放并填充满整个div的需求,但是前端本身图片并没有这种属性设置,所以要进行特别处理这种图片的展示方式再ios中叫Aspect fit,在安卓中叫 crop center 都是可以直接设置的,而再css里只能用特殊处理一般情况我们展示图片的时候,如果需要将图片设置一定比例的展示,可能会用div包裹,然后将图片设置最大宽度...原创 2018-11-29 16:10:15 · 3877 阅读 · 1 评论 -
Notification 浏览器桌面通知API使用理解及心得
Notification 浏览器桌面通知API使用理解及心得之前的项目中用到notification的桌面通知api,这里写一下自己的使用理解,虽然不是很麻烦,这里记录一下以防下次再去找。notification是通过向浏览器授权,向桌面推送通知的api,因为类似于一些重要消息,可能会被用户忽略,发起桌面通知更为明显,在这种业务场景下,我们就可以使用notificationNotific...原创 2018-12-19 21:21:28 · 1166 阅读 · 0 评论 -
ant design pro 详情页面包屑保持路由层级并显示,菜单不显示
ant design pro 详情页面包屑保持路由层级并显示,菜单不显示新项目中使用antd-pro框架,所以接下来会写一些关于antd-pro的踩坑详情页(修改页/添加页)和列表页在路由层级上通常是处在同一层的,这样可以渲染在同一位置,但是在面包屑的展示上给用户的感觉是详情页应该在列表页的下面,在antd-pro项目中并没有直接的方法,所以需要对menu.js文件做一下修改,下面是实现:...原创 2019-01-10 17:16:47 · 15332 阅读 · 2 评论 -
npm换淘宝源及安装cnpm
npm换淘宝源及安装cnpm换源是为了使用国内的镜像资源来取代从国外下载资源,速度上可以大大提升,虽然是很简单的操作,但是为了避免每次换源都需要从去网上找,故在此记下来安装cnpm使用淘宝源(方便安装完即用,但是存在有的资源cnpm无法下载 ,npm可以)npm install -g cnpm --registry=https://registry.npm.taobao.org命令行直...原创 2019-01-02 14:56:57 · 4441 阅读 · 0 评论 -
antd-pro 配置请求代理
antd-pro 配置请求代理新项目中使用antd-pro框架,所以接下来会写一些关于antd-pro的踩坑antd-pro中用的是fetch来实现http请求,封装成功一个request方法,在本地联调的时候需要该代理,通过本地服务器来请求后端服务,在部署到线上时需要使用nginx做反向代理需要在config/config.js 添加下面代码proxy: { '/api/': { ...原创 2019-01-07 20:22:17 · 12512 阅读 · 7 评论 -
sessionStorage多标签页共享
sessionStorage多标签页共享sessionStorage在不同页面上不是同步共享的,但是我们有时候会将token或者一些登录凭证记录在token里(你肯定要问为什么后端不把token直接写到cookie里,因为他懒…),所以这里就写一下怎么将不同页面的sessionStorage同步更新sessionStorage和localStorage区别localStorage的生命周...原创 2019-01-18 11:35:39 · 14053 阅读 · 1 评论 -
Ant Design的表单onChange阶段不更新踩坑,以及修改表单值方法
Ant Design的表单onChange踩坑新项目中使用antd-pro框架,所以接下来会写一些关于antd-pro的踩坑在写项目中,中有一个需求是在某个表单元素变化时,出发表单提交,但是发现一个问题是,将方法绑定onChange的时候发现此时通过表单方法获取的值还没有更新,不知道这个属于一个bug,还是在这个阶段本来就没有变更表单的values ,所以我是在onChange绑定的方法中手动...原创 2019-01-08 18:46:06 · 37380 阅读 · 8 评论 -
antd-pro中loading状态的dva-loading使用
antd-pro中loading状态的dva-loading使用新项目中使用antd-pro框架,所以接下来会写一些关于antd-pro的踩坑传统写loading状态的方法是,在异步请求的开始的时候开启loading,在异步请求的结束关闭loading,这样的写法是比较麻烦的,因为这一部分的操作都是比较一致的,在ant Design pro中就直接用了dva-loading插件,封装的很...原创 2019-01-08 20:34:08 · 11842 阅读 · 2 评论 -
ant design pro 修改request请求方法,修改为符合实际业务接口请求的数据处理方式
ant design pro 修改request请求方法,修改为符合实际业务接口请求的数据处理方式ant design pro中对fetch进行了封装处理,写在utils/request.js,但是与我们通常的接口格式的处理并不适配,我们业务出现的错误代码并不会直接放在网络层,而是放在json中,所以需要做一些修改原本写法在ant design pro的项目中,原本的请求处理中可以看出,...原创 2019-01-14 20:00:41 · 20642 阅读 · 4 评论 -
ant design 表单数字校验失效问题
ant design 表单数字校验失效问题ant design 的表单字段校验有很多细致得了类型校验, 就是用rule内的type属性设置的其中的值有:string: Must be of type string. This is the default type.number: Must be of type number.boolean: Must be of type boolea...原创 2019-01-21 20:30:30 · 7056 阅读 · 3 评论 -
ant design图片hover蒙层
因为ant design没有默认的蒙层插件,只有图片上传的头像上传类型存在悬浮显示蒙层的样式,所以我单独写了一个,悬浮显示蒙层用来操作的,很多场景都可以用到,这里记下来。原来样式:鼠标悬停样式:下面是写法://jsx部分 &lt;div className={ styles.info}&gt; &lt;span className={styles.actions}&g...原创 2019-02-01 19:53:36 · 2831 阅读 · 0 评论 -
超级好用的图片预览查看插件Viewer及在react,vue,jquery以及原生js的使用方法,详解react复用单个组件的写法
因为项目种常查看大图预览的需求,如果是自己写的用模态框写的查看大图,只是简单看看还可以,如果需要旋转,放大缩小,反转等等操作,就会很麻烦。也看过很多用来查看大图的插件,viewer真的是功能最为全面的,而且在各个框架中均有对应的封装插件,使用起来也很方便,所以这里写一下各个框架内viewer的使用方法。下面之说直接使用的方法,具体细节的options可以查看文档,下面也有文档连接Viewe...原创 2019-02-02 15:50:07 · 14782 阅读 · 11 评论 -
sessionStorage与localStorage存储的数据问题
今天发现一个问题,sessionStorage存储字符串的时候是直接存储的,localStorage存储数据的时候会自动将字符串再使用一次JSON.stringfy() 导致存的时候会加上双引号,这样如果sessionStorage和localStorage都存储了同一个字段的情况下就会出现问题。所以最好的解决方法就是,sessionStorage再存储的时候要手动使用JSON.stringfy...原创 2019-01-29 11:07:34 · 1266 阅读 · 0 评论 -
element-ui树形控件,子节点选择时,将半选状态的父节点同时取出的解决方法
用element的树形控件实现权限管理的时候碰到一个问题,当一项大权限节点下的小权限节点被选中时,大节点属于半选状态,但是最后输出的结果不包含大节点的id 这样会导致两个问题首先第一次选择时,传给后端的权限列表不包含大的权限id回显时,如果包含了大的权限时,会直接将大权限下的所有子权限都选中这样和我们的需求是完全不一样的, 看过文档也没有可配置的解决方法.然后我自己花了点时间用遍历+递...原创 2018-10-29 23:14:32 · 7750 阅读 · 5 评论