自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(58)
  • 收藏
  • 关注

原创 Antd的TreeSelect组件收起展开热区扩展

Antd的TreeSelect组件收起展开热区扩展

2022-07-09 00:07:08 2414

原创 Antd的Tree组件收起展开热区扩展

实现Antd的tree组件通过点击节点所在热区就能完成节点的收起与展开

2022-07-08 21:44:56 2465

原创 Vue项目引入Mock.js,只在开发环境打开,方便多人开发

Vue项目引入Mock.js,只在开发环境打开,方便多人开发

2022-06-13 19:56:55 1118

原创 antd+Select组件使用suffixIcon点击无反应问题

解决ant的select组件使用suffixIcon后,点击Icon无法控制下拉框的显隐问题

2022-06-12 09:59:28 2109 1

原创 vue使用插值语法渲染字符前后莫名加上空格

错误写法<span> {{true?',':''}} <a>test</a></span>这种写法渲染结果如下:会把换行符渲染成空格正确写法<span>{{true?',':''}}<a>test</a></span>渲染结果如下:...

2022-04-11 20:13:00 1151 1

原创 前端JS面试题

1.JS数据类型基本数据类型:null,undefined,Number,String,Boolean,Symbol,BigInt引用数据类型:Object,Array,Function,Date,RegExp等等2.堆和栈的存储机制有什么区别堆:一种非连续的树形存储数据结构,每个节点有一个值,整棵数是经过排序的。特点是根结点的值最小(或最大),且根结点的两个子树也是一个堆。常用来实现优先队列,存取随意。栈:一种连续存储的数据结构,具有先进后出的特性。通常的操作有入栈,出栈。想要读取

2022-04-10 14:22:02 902

原创 JS判断变量是否为空

function(a){// 第一种if(!a&&a!==0)// 第二种 if(isNaN(parseFloat(a)))}

2022-04-07 17:17:17 369

原创 antd4的cascader动态加载需要点击两下才会加载子级数据,而且加载的是第一次请求的

我的需求是使用cascaser的动态加载和多选功能首先多选功能是需要4.17.0版本才有的,一开始没注意到自己antd的版本比较低,还以为这两个功能不能合并在一起还有遇到的一个问题就是需要点击两下才会加载自己数据首先附上官网的示例代码const loadData = selectedOptions => { const targetOption = selectedOptions[selectedOptions.length - 1]; // 这行可设置可不设置

2022-02-10 10:01:35 1070

原创 动态高度元素设置滚动条技巧

对于自身高度不确定的元素,需要为其设置滚动条时。可以将其父元素设置为flex布局,自己的高度设置为0,并且flex值设置为1

2022-01-08 20:29:17 673

原创 qiankun遇到问题

如果项目使用的是webpack多入口的配置方式(1) 在入口文件写乾坤的钩子函数可能会识别不了。(2)通过require引入的钩子函数也不能识别,因为钩子函数是通过export方式导出的。

2021-12-27 22:34:02 713

原创 element-ui popover 弹窗滚动条问题

在一次需求中,需要用到popover这个组件,弹框的内容很长,所以会有滚动条但是当移动弹框滚动条后,再隐藏,再显示的话,弹框的滚动条会被重置到初始为止,即最左边或者坐上面,换句话说就是scrollTop值会被重置为0但是产品想要保留隐藏之前滚动条的位置解决方案就是,隐藏之前获取到滚动条的位置(即scrollTop值),显示后再将scrollTop值赋回去。在Vue中注意赋值回去的操作需要在$nextTip回调函数下执行,不然还是会被组件自带的重置操作给覆盖掉。...

2021-12-22 07:55:10 3096

原创 iframe嵌页面遇到问题

通过iframe嵌入页面,想要做到通过cookie传递登陆信息的方式做到主项目和父项目之间的单点登录,行不通的原因是父项目与子项目之间的域名不相同,导致接口返回头中的set-cookie不能被子项目的域名获取到,所以不能做到单点登录。解决方法:使得父项目和子项目域名相同...

2021-12-15 10:37:44 2307

原创 window.parent === window嘛

window.parent功能:返回父窗口。语法:window.parent注:如果窗口本身是顶层窗口,parent属性返回的是对自身的引用。所以在本项目中调用window.parent.postmessage方法,当本项目被嵌套时,父项目中的window.addEventListenter('message',function(){})方法可以接收到postmessage传递的消息当本项目没有被嵌套时,自己项目中的window.addEventListenter('messag

2021-12-09 20:21:56 586

转载 React中Redux持久化State到localStorage

针对实际应用中需要对于应用的部分数据持久化的需求,这里写个例子简单说一下Redux怎么处理,一共就两步很简单 首先自己创建处理存取localStorage的方法,这里对于异常做一些处理 使用loadState方法读取持久化的数据,在createStore时候使用第二个参数来指定;同时订阅store的变化调取存储的saveState方法,这里针对性能使用lodash的throttle方法做了节流限制 ...

2021-09-16 19:17:05 640

原创 React中向标签插入自带标签的字符串

最近的一个需求是,模糊查询返回结果。在返回的结果数据中,将结果数据中与查询字段相同的部分高亮。1.首先后端返回的模糊查询结果是一个个字符串,检测每个字符串中是否含有查询字段,如果有,则将返回结果中的查询字段 从字符串替换成带有类名的标签,给该类名设置高亮的样式,就能达到匹配高亮的效果。2.涉及到的问题是,返回结果被替换成含有类名的标签字符串之后,再将其放到展示该结果的标签内,标签怎么识别带有类名标签的字符串呐Vue中可以通过V-HTML实现,那么在React中呐,则可以通过dangero..

2021-08-23 20:18:50 697

原创 antd tree scrollTo 不起作用

前提需要给Tree组件设置height属性,设置虚拟滚动容器高度,这样scrollTo才能够起作用其次,scrollTo的key值需要是已经展开的节点,所以需要提前将scroll中key值对应的节点展开对应代码如下:import { Tree, Button } from "antd";import React, { useState, useRef, useEffect } from "react";function dig(path = "0", level = 3) { con

2021-08-22 10:40:35 2599

原创 实现最多展示两行文本,超出用省略号表示

html部分<div class="text"> <!-- <label class="btn">展开</label> --> <span>weimeimeiweimeimeiweimeimeiweimeimeiweimeimeiweimeimeiweimeimeiweimeimeiweimeimeiweimeimei weimeimeiweimeimeiweimeimeiweimeim

2021-08-18 20:19:04 877

转载 word-wrap和word-break的区别

你真的了解word-wrap和word-break的区别吗?这两个东西是什么,我相信至今还有很多人搞不清,只会死记硬背的写一个word-wrap:break-word;word-break:break-all;这样的东西来强制断句,又或者是因为这两个东西实在是太拗口了,长得又差不多,导致连背都很难背下来。那它们到底是什么呢?我在mozilla的官网上找到如下的解释:word-wrapword-break我们看到两个解释中都出现了 break lines within words

2021-08-18 19:49:15 1079

转载 antd <a-table> 增加自增序号+分页

使用pagination组件来设置分页1.在table中引入pagination <a-table :pagination="pagination":columns="columns" @change="tableChange" :data-source="data" size="small" bordered>a-table>2.在data返回值中初始化paginationpagination: { total: 0, /

2021-08-13 15:56:53 2552 1

原创 React Hooks

1.State Hook(1)State Hook 让函数组件也可以有state状态,并进行状态数据的读写操作(2)语法: const [xxx,setXxx] = React.useState(initValue)(3)setXxx()2种写法setXxx(newValue):参数为非函数值,直接指定新的状态值,内部用其覆盖原来的状态值setXxx(value => newValue):参数为函数,接收原本的状态值,返回新的状态值,内部用其覆盖原来的状态值。2.Effect.

2021-08-08 11:00:12 44

原创 iView中Table组件通过render属性渲染自定义组件

// render函数的参数h代表creatElement函数,参数o代表三个属性值,具体查看iView文档render(h,o) {// h函数的第一个参数代表要渲染的元素,可以是标签名称也可以是自定义组件名称,标签名需要加上''// h函数的第二个参数代表渲染元素的内容,自定义组件就是传递props,标签名就是传递标签内容// h函数的第三个参数代表渲染元素的子元素,传递的是数组形式h(LineText,{props:{},[h('div','--')])}// 注意:如果是渲染自定.

2021-07-17 15:19:08 989

原创 JS 判断变量是否存在&&是否为字符串类型&&是否为空字符串

function isEmpty(obj) { return obj && typeof(obj) === 'undefined' && obj.trim() !== '' true : false}

2021-07-14 16:48:21 177

转载 React antd Upload限制上传类型

<Upload name="file" className="uploader" listType="picture-card" showUploadList={false} accept=".xls, .xlsx" beforeUpload={this.beforeUpload.bind(this)}>可以直接利用后缀名限制,如下# 仅能上传execl 文件accept=".xls, .xlsx"# 仅能上传图片文件ac...

2021-07-14 16:37:11 2775

转载 inline-block 配合伪元素实现元素垂直居中

inline-block 实现元素垂直居中1.元素的显示方式:1    display:inline;3 display:linline-block; 5    display:block display:inline 表示,元素做为内联元素显示,两个或者多个内联元素可以并列成一行显示;常见的内联元素如:span strong 标签;内联元素的特点是:(1)不能给内联元素设置宽和高;(2)元素和其他元素共占一行; display:block 表示,元素作为块级元素显示,...

2021-07-13 20:28:42 2587

转载 vscode中 yarn : 无法加载文件 C:\Users\Admin\AppData\Roaming\npm\yarn.ps1,因为在此系统上禁止运行脚本

问题描述:yarn : 无法加载文件 C:\Users\Admin\AppData\Roaming\npm\yarn.ps1,因为在此系统因为在此系统上禁止运行脚本。解决方法:以管理员身份运行vscode;执行:get-ExecutionPolicy,显示Restricted,表示状态是禁止的;执行:set-ExecutionPolicy RemoteSigned;这时再执行get-ExecutionPolicy,就显示RemoteSigned;...

2021-07-13 17:43:20 1129

转载 强制SPAN不换行

今天要解决的问题是,限制span标签不换行,并使超出的部分以点号代替。 需求效果图: 实现代码如下:HTML代码​​​​​​​<div> <span>费用自理</span> <span class="spanStyle">80000000</span>   <span><img src="../img/tip.png"></span></div&gt...

2021-07-08 11:22:28 9305

转载 正则表达式校验url是否以http或https开头

1.方法一: 1 /(http|https):\/\/([\w.]+\/?)\S*/  这个方法的特点是可以提取出协议名;2.方法二:/http[s]{0,1}:\/\/([\w.]+\/?)\S*/这个方法的特点是不提取出协议名;

2021-07-08 09:07:51 8319 4

转载 git删除分支

1.切换到你git项目所在的目录后,使用 git branch -a命令来查看所有的分支。2列出所有分支了,其中上方的是本地的分支,下方的有remotes/origin开头的就是远程分支。3.假设要删除new-a的远程分支,我们需要先把分支切换到master,因为你现在所在的分支就是new_a,在这个分支下,是不能删除它的。使用命令 git checkout master4.接着就是删除远程分支的命令了, git push origin --delete new_a5.回车确认,提示我们

2021-07-06 19:54:37 121

原创 antd的Modal

1.如何自定义modal的确认和取消按钮(1)隐藏底部确认和取消按钮使用Modal中的footer属性,如下:<Modaltitle="哈哈"visible={visible}onCancel={this.handleCancel}footer={[] // 设置footer为空,去掉 取消 确定默认按钮}></Modal>(2)自定义底部按钮使用Modal中的footer属性,如下:footer可以是一个数组,数组里面放的是按钮,可以根据需求

2021-07-06 19:50:26 3905

原创 React中配置代理结局跨域问题

1.假设你在项目中站在3000端口给localhost:4000发送请求,浏览器会根据同源策略报跨域错误。请求代码如下:axios.post('http:localhost:3000/login,values).then((result)=>{ console.log(result) }.catch((reason)=>{ console.log(reason)}))如何解决这个跨域问题呐?在package.json文件中添加一个键值对为"proxy":"http://local

2021-07-04 18:14:32 89

转载 git---从已有分支拉出新分支

1:需要切换到被拉取的分支,并且拉取项目,命令如下: 1 2 3 $git checkout master $git pull 2:接着创建一个新分支,并且切换到新的分支: 1 2 3 $git checkout -b newbranch 3:把本地分支push到远端: 1 $git push origin newbranch .

2021-06-29 16:40:06 877

转载 vuex中store保存的数据,刷新页面会清空解决办法

参考下面这篇博文,在自己的csdn引用是为了自己日后方便寻找https://www.jianshu.com/p/9d805d749456

2021-05-03 10:32:36 601

转载 vue-cli3搭建完整项目之webpack配置

此篇作为转载记录,方便自己日后查找,附上链接:https://blog.csdn.net/weixin_44524836/article/details/88376804

2021-04-29 09:29:20 131

原创 mongodb安装

步骤一:下载 https://www.mongodb.com/download-center/community点击这个链接,找到下图所在位置,点击红框所在处会跳转到新的页面,再ctrl+F搜索window(因为我是windows系统)步骤二:解压步骤三:创建服务在bin的同级目录上创建data文件夹 logs文件夹用管理员身份打开命令窗口,cd到mongodb下载目录的bin目录下,执行mongod.exe --install --dbpat...

2021-03-30 10:04:17 101

转载 2021-01-05

如何删除本地分支存在但是远程分支已经不存在的分支下面这篇教程可以删除通过git branch -a查看到的本地分支在但是远程分支已经不存在的分支https://blog.csdn.net/wangqingpei557/article/details/53147086但这个通过git branch还是能够看到自己的分支的,要想删除git branch 查看到的分支信息需要通过git branch -D 分支名称 来手动删除该分支信息,当然不能删除自己当前处在的分支...

2021-01-05 13:44:58 30

转载 面试高频算法题-单链表系列(1)-倒置链表

反转链表是一道比较基础的算法题啦,但是确实面试高频算法题,同学前两天字节一面就被问到了这个问题,写篇博文来记录一下首先上题目:思路都写在注释里啦,所以直接上代码啦:var reverseList = function(head) {//首先声明三个变量,分别为revHead:反转后的头节点,//temp:记录旧的next节点//cur:记录当前遍历的节点//初始化反转后的头节点为空,当前遍历的节点为头节点 var revHead=null,temp,cur=head;

2020-07-31 12:05:35 193

转载 css样式优先级问题

此片博客为参考博客,更多详情可看:https://www.cnblogs.com/ombre/p/7418667.html官方表述的CSS样式优先级如下:通用选择器(*)<元素(类型)选择器<类名选择器<属性选择器<伪类选择器<ID选择器<内联样式其中内联样式只能通过style=""来声明而上面的通用选择器到ID选择器都是既可以在嵌入样式中声明也可以在外部样式中引用,同样的选择器,在嵌入样式中声明的优先级总是大于在外部样式中声明的,具体优先级如下表:

2020-07-28 10:35:44 1053

原创 vue中key值的作用&&vue虚拟dom

1.vue中key值的作用key值的作用是为了给每个组件有唯一的一个识别身份,主要是为了vue精准的追踪到每一个组件,高效的更新虚拟DOM2.什么是虚拟domvdom可以看作是一个使用js模拟了DOM结构的树形结构,这个树形结构包含了整个DOM结构的信息3.为什么要使用虚拟DOM相比往常的通过JS或者JQuery操作dom是非常复杂的一个过程,每次操作dom都要遍历一遍自己的代码,而且也不知道能不能遍历到,并且只能dom只能一个一个按顺序更新,虚拟dom可以将所有的要操作的dom事先更新

2020-07-21 17:04:26 371

转载 前端面试考点---CDN加速原理

一、CDN产生的背景 由于网民数量越来越多,用户与网站之间的链路可能会被突发的大流量数据拥塞,从而使用户的访问质量受到严重影响;同时用户对于浏览器的浏览速度和效果的要求也越来越高,所以为了解决此问题,就是CDN的由来。二、CDN的概念CDN的全称是Content Delivery Network,即内容分发网络。其目的是在用户和服务器之间通过现有的网络建立一个类似于Cache的网络架构,将网站的内容发布到最接近用户的网络“边缘”,使得用户可以很快的访问到自己所需要的资源,节省了用户访问的时..

2020-07-03 14:18:53 824

转载 浅学前端SPA(单页面应用)

1.概念单页Web应用(single page web application,SPA),所有活动都局限在一个Web页面中,只加载单个Html页面,并且在用户与应用程序交互时动态刷新页面。2.优点1)有良好的用户体验用户不需要频繁的去切换页面2)前后端分离3)减轻服务器压力服务器只需要提供数据即可,不用管页面展示4)共用一套后端服务器代码不用修改后端程序代码就可以用于Web页面、手机端、平板3.缺点1)初次加载耗时多由于所有内容都在一个页面中,所以第一次.

2020-07-02 17:37:34 296

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除