- 博客(118)
- 收藏
- 关注
RSS订阅
原创 Echarts x轴文本内容太长的几种解决方案
Echarts 标签中文本内容太长的时候怎么办 ? - 1对文本进行倾斜 在xAxis.axisLabe中修改rotate的值 xAxis: { data: ["衬衫11111","羊毛二二","雪纺衫111","裤子111","高跟鞋11","袜子111"],//x轴中的数据 name:"123",//坐标轴名称。 na
2017-10-23 17:40:52
117432
36
原创 Antd Table带有分页的全选功能
这种带有分页的全选 如果我们翻页也需要记录跨页的勾选数据 antd自带的onChange事件只能记录选中RowKey值 但是勾选的数据只会是当前页的条数 此时就需要我们结合onSelect和onSelectAll来完成数据的交互。// 存储所有页面选择的数据，比如第一页两个，第二页两个，都存到这个数组中。allSelectedRows就是所有页你勾选的数据的数组。
2023-08-04 07:43:04
1151
原创 fetch设置timeout
上述成功方式引用https://blog.csdn.net/u010688637/article/details/56005394。公司用的是fetch 但是不支持timeout属性, 一时找不到。后端问了我文件导出的超时时间是多少?上网搜索了一下 有的用。
2022-11-15 19:49:13
789
1
原创 Mac系统每次更改vscode中的文件都提示权限不足
我切换分支 不起作用 我就得重新再来一遍 或者我点击整个文件夹给权限的时候 容易卡住 然后只能等 …等了好久也没反应就开始暴躁了…翻译成中文的意思就是 文件无法保存, 无权限, 请用超级管理员身份进行修改。其实我很纳闷 我已经是超级管理员了 为什么没有权限更改它?我还是每次切换分支 就又不能修改了 得重新再输入后两行命令才行。当我在vscode修改文件 保存的时候vscode 右下角弹出。你可以点击 resry as sudo…以上就是我的步骤 这样就可以修改了。开发过程中遇到一个问题。
2022-11-15 19:37:08
5734
1
原创 Echart新社区地址
很久没写echarts 突然发现之前的社区地址无法访问了 上网搜索了很久找到了新的地址。登录之前的账号 之前写的例子都还在。
2022-11-02 17:39:20
788
原创 react ahooks 表格中的每条数据都实现倒计时功能
现在有一个需求, 点击一条数据的下载操作, 开启30s倒计时, 点击另一个也是开启30s倒计时, 但是两者的倒计时互不冲突。在我们日常需求中, 实现一个倒计时是常见的需求, 或者一个页面有两个倒计时 我们都可以去实现, 但是如何实现在。interval.js中的内容。...
2022-08-04 10:29:49
1169
原创 git 回退版本
会发现我们第二次提交的代码的版本记录不在了但是这个时候我可能会又想回到之前提交的代码的版本但是现在查不到版本记录。然后找到你想回退的内容,复制commit后面的版本号。在我们写代码的过程中,我们会出现回退版本的情况,这个时候的代码就是你回退的版本的代码。这个时候我们应该如何操作?上面的版本号就是我们需要会退的。...
2022-07-29 15:05:39
234
原创 nrm ls 为什么前面不带 *了
但是这个时候没有星号表示我正在使用的是哪个源。某天当我想要查看当前使用的源是哪个的时候。是npm的镜像源管理工具。此时我们需要知道nrm的位置。
2022-07-28 16:32:55
368
原创 前端搭建自己的cli脚手架, 实现前端工程化
我们都知道,vue-clli,是知名的脚手架工具,但是在我们日常开发过程中,总是会出现公用的组件或者公共的方法,如果每次都从项目中粘贴复制会很麻烦,尤其是复杂一点的组件(深有体会…或者你们公司有很多业务线但是呢基本框架都是不变,主色调,布局,排版等等,这个时候就需要一个模版,你只需要通过自己搭建的私有库就可以一键生成。...
2022-07-19 19:22:46
570
原创 [eslint] Failed to load parser ‘@typescript-eslint/parser‘ declared in ‘package.json » eslint-confi
Failed to compile.[eslint] Failed to load parser ‘@typescript-eslint/parser’ declared in ‘package.json » eslint-config-react-app#overrides[0]’: Cannot find module ‘typescript’Require stack:解决方法:
2022-07-04 15:30:47
5014
原创 gitlab配置ssh
当你打开你的gitlab的时候 会提示这就意味着你没有配置sshgit clone 代码的时候 需要输入gitlab的邮箱和密码才可以pull 但是只要配置ssh就可以不用每次都输入邮箱和密码开始配置打卡终端输入以下命令生成ssh公钥和秘钥 一直回车ssh-keygen -t rsa -C '[email protected]'邮箱是你gitlab绑定的邮箱根据提示找到文件 进入/Users/zhangmin/.ssh 打开 id_rsa.pub 文件打开gitlab 把文件内容复制到key的文
2022-05-24 10:23:44
1594
原创 zsh: command not found: nvm
zsh: command not found:nvm解决办法之前使用mac pro 的时候 有安装过nvm具体的操作流程在nvm配置正常情况下完全可以的但是今天用了公司的电脑 是macBook Air发现我配置完成以后 nvm --version 已经可以了但是当我新开iTerm 或者在项目中使用 nvm 总是会报zsh: command not found甚至npm 的命令都没办法使用上网搜了一圈 很多都没有效果 当然最后还是解决了具体如下在~/.bash_profile添加s
2022-05-18 20:36:02
9174
2
原创 阿里云oss上传图片
安装依赖 npm install --save axios js-base64点击修改按钮弹框选择图片或者文件代码index.js <AliyunOSSUpload onGetFileUrl={onGetFileUrl} />AliyunOSSUpload.jsimport React from 'react';import { Form, Upload, message, Button } from 'antd';import { getOSSClientCredit,
2022-05-16 10:47:49
615
原创 数组结构和树状结构的互转
<!DOCTYPE html><html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <titl
2022-05-05 17:36:47
547
原创 多维数组展平成一维数组
let arr = [1, [2, [3, [4, 5]]], [6, 7, [8, 9, [11, 12]], 10]] let result = [], fn = function (arr) { if (arr.length === 0) return for (let i = 0; i < arr.length; i++) { let item = arr[i] if...
2022-04-28 20:32:32
366
原创 解决浏览器会自动填充密码的问题
在前端开发过程中有一个现象:有登录和注册的弹框，当我们从登录弹框中登陆成功，chrome会弹出是否保存密码的提示框，点击保存密码按钮，然后接着退出账户，这时打开注册弹框，你会发现注册弹框中用户名和密码也被默认填写进去了（登录弹框中默认填写进去符合逻辑）but! 有时候 我们在一些别的场景中是不需要这个默认显示功能的, 因为怎么做?查阅资料解决方案在form上或input上添加autoComplete='off'然而 chrome中并没有生效原因: form中有input[type=passw
2022-04-18 09:53:53
2568
原创 Form 表单内有多个元素的使用方式
产品中常有的一个需求输入框后面有描述文案或其他组件我们可能这样写<Form.Item name="firstName" label="姓名" rules={[{ required: true, message: '请输入姓名!' }]}> <Row gutter={8}> <Col span={12}> <Input defaultValue={detail?.firstName} /> &
2022-04-16 14:34:09
2691
原创 react hooks实现一个手机验证码倒计时功能
import { Button, Input } from 'antd'let timerconst Btn = () => { const [time, setTime] = useState(5) const [btnDisabled, setBtnDisabled] = useState(false) const [phone, setPhone] = useState() const [btnContent, setBtnContent] = useState('获取验
2022-03-25 18:33:12
2212
原创 nvm的安装
本想使用create-react-app创建一个react项目但是当我输入1 npx create-react-app react-hooks-demo提示我You are running `create-react-app` 4.0.3, which is behind the latest release (5.0.0).We no longer support global installation of Create React App.Please remove any glo
2022-01-13 15:32:11
466
原创 安装nvm 报错curl: (7) Failed to connect to raw.githubusercontent.com port 443: Connection refused
需要在在不同项目中使用不同的node版本时，可以使用nvm管理1.卸载node卸载之前安装的node，使用nvm重新install node版本进行管理sudo rm -rf /usr/local/{bin/{node,npm},lib/node_modules/npm,lib/node,share/man/*/node.*}2 打开终端执行以下命令curl -o- https://raw.githubusercontent.com/creationix/nvm/v0.33.8/inst
2022-01-12 14:26:11
1672
原创 node升级版本
查看当前node版本node -v清除npm缓存npm cache clean -fn模块是专门用来管理nodejs的版本，安装n模块npm install -g n更新升级node版本n stable // 把当前系统的 Node 更新成最新的 “稳定版本”n lts // 长期支持版n latest // 最新版n 16.13.1 // 指定安装版本升级完成查看 node版本node -v...
2022-01-12 11:25:26
14839
1
转载 详解 Javascript十大常用设计模式
原文: https://www.cnblogs.com/tugenhua0707/p/5198407.htmljs 常见的设计模式工厂模式工厂模式类似于现实生活中的工厂可以产生大量相似的商品，去做同样的事情，实现同样的效果;这时候需要使用工厂模式。简单的工厂模式可以理解为解决多个相似的问题;这也是她的优点;比如如下代码 <script> function Person(name, age, sex) { var obj = new Object()
2021-09-06 15:28:01
219
原创 js的延迟加载方式
首先我们要考虑为什么要提出js的延迟加载??有助于提高页面加载速度, js延迟加载就是等页面加载完成以后再加载js文件我们都知道 dom元素是从上到下渲染的, 如果js来管理页面上的元素, 并且js加载操作想在HTML之前, 代码就会报错.eg:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta http-equiv="X-UA-Compatible"
2021-09-02 15:30:58
544
原创 前端面试题(持续更新.....)
根据印象, 回忆面试题目, 发现大厂注重基础HTML篇1.html的块级元素, 行内元素分别有哪些?块级元素: div, p, h1, h2, h6, dl, dt, dd, hr, form, ul, li, ol, noscript, caption定义表格标题等行内元素:a, b, i, img, input, label, select, em, textarea, select等CSS1. 引用外部的文件 有哪些引用方式, 引用的差别是什么?我们知道引入css的方式有四种1.行内
2021-09-01 18:03:36
453
原创 cookie, localStorage, sessionStorage的区别
localStorage, sessionStorage存储在客户端统称为web Storage不同点存储数据大小cookie的长度和数量有限制, 每个domain最多只有20条cookie, 每个cookie长度不超过4KB,否则会被截掉. web Storage一般5M或者更大,安全性如果cookie被人拦截到, 那个人可以获取到所有的session信息, 加密也不会有效果WebStorage不会随着HTTP 发送到服务器端,不参与服务器通信, 所以安全性较高, 不会担心被拦截, 但是仍然
2021-09-01 17:14:31
97
原创 @import 和link之间有什么区别?
1.所属关系:link不仅可以导入样式表, 还可导入其他, 入, favicon, 但是@import 只可以引入样式表.2.l兼容性:ink是XHTM语法, 不存在兼容问题, 当时@import是在css2.1才提出的, 在IE5+后才支持, 所以对低版本的浏览器有兼容性问题.3 DOM可控制可以通过 JS 操作 DOM ，插入link标签来改变样式；由于 DOM 方法是基于文档的，无法使用@import的方式插入样式。4.加载顺序link是在页面加载的的同时一起加载的，@import是页.
2021-09-01 16:39:23
99
原创 主流的浏览器内核种类?, 对前端的影响?
什么是浏览器内核?1 浏览器讷河可以理解为排版引擎, 主要由渲染引擎和JS引擎.2.排版引擎主要是负责获取网页内容(HTML,XML, CSS, JS, 图像)等信息进行解析, 渲染网页, 将网页的代码转换为看得见的页面2 浏览器的内核的不同,对于网页的语法解释会有不同, 所以渲染的效果也不相同, 常见的内核有Trident,Gecko., Webkit, Presto,'BlinkTrident内核: IE浏览器以Trident作为内核引擎. Trident内核很慢Gecko: Fire
2021-09-01 16:22:41
335
原创 原型与原型链
面试时必问题:什么是原型?, 什么是原型链?回答什么是原型的答案:1.所有引用类型, 都有一个__proto__(隐式类型)属性(不是只有实例对象才有1), 其值是一个对象2.每一个函数都有一个prototype(显示原型)属性,(不是只有构造函数才有) , 这个属性对应着一个对象, 这个对象就是我们所谓的原型对象3.所有引用类型的__proto__属性指向它构造函数的prototype var a=[] console.log(a.__proto__ == Array.pro
2021-08-31 17:29:39
147
原创 js中闭包的理解
对于闭包二字, 我们常常听说, 可能更加知道面试的时候, 面试官必问知识点之一在MDN 中, 对闭包是这样定义的一个函数和对其周围状态（lexical environment，词法环境）的引用捆绑在一起（或者说函数被引用包围），这样的组合就是闭包（closure）。也就是说，闭包让你可以在一个内层函数中访问到其外层函数的作用域。在 JavaScript 中，每当创建一个函数，闭包就会在函数创建的同时被创建出来。要想理解闭包, 必然需要理解js的变量作用域: 全局变量和局部变量我们都知道, 在函数内部
2021-08-30 19:33:09
677
原创 call(), apply(), bind()之间的区别
我们知道 this是js中的一个关键字, 而且this指向的是调用函数的那个对象.对于 call, apply, bind 三者有一个共同点就是可以改变this指向.但是bind和call,apply两者不太相同;bind() 方法创建一个新的函数，在 bind() 被调用时，这个新函数的 this 被指定为 bind() 的第一个参数，而其余参数将作为新函数的参数，供调用时使用。call()方法使用一个指定的 this 值和单独给出的一个或多个参数来调用一个函数。apply() 方法调用一个具
2021-08-30 15:26:45
130
原创 判断数据类型的几种方法
typeof目前能返回以下8种判断类型值类型stringnumberbooleansymbolbigint(es10新增)undefined引用类型objectfunction console.log(typeof '嚣张') // string console.log(typeof 18) // number console.log(typeof true) // boolean console.log(typeof undefined) //
2021-08-30 10:49:08
277
原创 使用moment.js推算当前时间的前多少天
在项目中遇到一个问题, 推算当前时间的前7天, 30天 , 当然使用js一点点推算可以的, 但是可以使用moment.js 简单就可以推算出来获取当前时间moment().format('YYYY-MM-DD HH:mm:ss')当前时间的前7天moment().subtract(7, "days").format("YYYY-MM-DD HH:mm:ss")...
2021-08-18 16:50:23
2195
原创 react-路由懒加载
路由懒加载是什么意思?在开发中 , 我们打开开发者工具, 会发现我们刚刚打开就会去加载所有页面.路由懒加载就是只加载你当前点击的那个模块按需去加载路由对应的资源, 可以提高加载速度 (一个页面加载过后再次访问不会重复加载)实现原理：将路由相关的组件，不再直接导入了，而是改写成异步组件的写法，只有当函数被调用的时候，才去加载对应的组件内容方法一: 重写首先, 新建一个asynccComponent.js , 作为公共jsimport {Component as ReactComponet} fr
2021-07-01 10:31:16
1184
原创 render props
render props 是什么 ? react官网给出了一个解释: render prop 是一个组件用来了解要渲染什么内容的函数 prop。import React, { Component } from 'react'export default class Parent extends Component { render () { return (<> <h3>我是parent组件</h3> <Children
2021-06-30 16:52:28
232
原创 组件间通信方式-context
组件之间通常会遇到兄弟组件之间传递参数 ,最简单的方式可能是统一交给父组件处理, 然后再把数据交给下面的子组件, 我们可以通过contex来进行兄弟组件之间数据传输首先我们先创建context容器对象testContext.jsimport * as React from 'react';export const TestContext = React.createContext()渲染子组时，外面包裹xxxContext.Provider, 通过value属性给后代组件传递数据：ch
2021-06-29 15:12:03
330
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人