- 博客(25)
- 收藏
- 关注
RSS订阅原创 html2canvas+jsPDF将页面DOM输出为PDF
客户端 Safari 和 iPhone Safari 支持得最好，其次是 Opera 和 Windows 下的 Firefox 3 等。的，因此可能不会 100% 精确到真实的表示，因为它不会生成实际的屏幕截图，而是基于。服务器端可以完美运行。
2022-09-30 14:20:47
722
原创 react-copy-to-clipboard 复制内容到剪贴板的库
有时在项目中需要将一些口令复制到用户的剪贴板，这时候就可以使用这个react库：react-copy-to-clipboard导出标签：CopyToClipboardAPI： 要复制到剪贴板的文本 可选回调，将在复制文本时调用；onCopy(text,result) :如果复制成功则返回，否则返回。 可选的复制到剪贴板选项。 实例：...
2022-07-05 14:18:50
2181
原创 react-router 的withrouter高阶组件
在react-router中，只有通过Router渲染出来的组件中才会有history、location、match 三个对象，但是会存在需求让我们在非路由组件中进行路由跳转，withRouter的作用就是：把不是通过路由切换过来的组件中，将react-router 的 history、location、match 三个对象传入props对象上当然啦，withRouter（v6版本弃用了），换成了直接用useNavigate （强行hooks起来！！！！）类组件是成版本弃子了吗……...
2022-03-28 21:00:47
1136
2
原创 antd表单按钮验证置灰
1.初始置灰componentDidMount() { // To disabled submit button at the beginning. this.props.form.validateFields(); }2.置灰不显示报错判断是否有错和输入框是否有空 hasErrors = (fieldsError) => { return Object.keys(fieldsError).some(field => fieldsError
2022-03-15 14:09:22
2139
原创 ES6中async和await
async/await和Promise的关系async和await是我们进行Promise时的一个语法糖，async/await为了让我们书写代码时更加流畅，增强了代码的可读性。简单来说：async-await 是建立在 promise机制之上的，并不能取代其地位。async 写在函数前，声明该函数为 async函数； await 后面跟表达式，但一般只使用在 Promise对象； async 和 await 一般是联合使用 async 和 await 两种语法结合可以让异步代码像同步代码一样
2022-03-06 13:46:12
492
转载 常用的Linux命令（多少得会点）
常用指令1.说出10个linux常用的指令ls 查看目录中的文件cd /home 进入 ‘/ home’ 目录；cd .. 返回上一级目录；cd ../.. 返回上两级目录 mkdir dir1 创建一个叫做 ‘dir1’ 的目录 rmdir dir1 删除一个叫做 ‘dir1’ 的目录 （只能删除空目录） rm -f file1 删除一个叫做 ‘file1’ 的文件’，-f 参数，忽略不存在的文件，从不给出提示。 rm -rf /mulu 目录下面文件以及子目录下文件 cp /t.
2022-03-06 12:51:40
99
原创 axios的常见封装（基于react，嘿嘿有点浅显……但会慢慢迭代）
在看GitHub项目的时候，我项目clone完安装完依赖跑起来，第一步我会去看看这个项目的请求request、route配置、权限管理等。这个文章讲的是看的几个项目的request的封装方式。一、引入请求库，配置基础请求首先就是引入相应的库：import Axios, { AxiosInstance, AxiosTransformer } from 'axios'; import qs from 'qs'; //请求数据格式化的库import { createBrowserHistor
2022-02-26 22:26:34
646
原创 useContext和useReducer及二者的结合使用
当你的react项目不大，但是需要组件之间传值的时候，父子之间的组件传值倒是可以简单解决，可是如果要是兄弟之间的组件传值呢？redux又没必要，这个时候就可以使用usecontext这个hook来解决。并且可以用useReducer管理包含多个子值的 state 对象。(模拟一个小型redux场景，而无法替代redux)一、useContext和useReducer1、useContext：useContext可以帮助我们跨越组件层级直接传递变量，实现数据共享。就是对它所包含的组件树提供全局共享
2022-02-19 20:24:23
1994
2
原创 react-cookie一个方便于我们操作cookie的react库
原生js的cookie操作并不友好，多数情况下需要我们自己封装。比如在项目国际化的时候，常需要将语言类型存储在cookie中。这就要推荐一下我今天的这个react操作cookie的库—— react-cookie下载依赖：cnpm install react-cookies --save-dev 或者：yarn add react-cookie使用 import cookie from 'react-cookies'; 引入cookie的存取和删除：cookie.save(..
2022-02-10 21:12:19
3721
1
原创 防抖和节流及其简单实现（react为例）
防抖和节流可以节省资源，减小服务器端压力，提升用户体验。在日常开发中，我们经常会有这样的需求：监听用户的输入（keyup、keydown）、浏览器窗口调整大小和滚动行为（resize）、鼠标的移动行为（mousemove）等。如果这些事件一触发我们就执行相应的事件处理函数的话，那将会造成较大的资源浪费或者给用户带来不好的体验。这时防抖和节流就派上用场了！！一、防抖：防抖：触发高频事件后n秒内函数只会执行一次，如果n秒内高频事件再次被触发，则重新计算时间。思路：每次触发事件时都取消之前的延时调
2022-02-07 21:58:20
1954
原创 react render 的原理和触发时机
理解react的render函数，要从这三点来认识。原理、执行时机、总结。一、原理在类组件和函数组件中，render函数的形式是不同的。在类组件中render函数指的就是render方法；而在函数组件中，指的就是整个函数组件。 classFooextendsReact.Component{ render(){ //类组件中 return<h1>Foo</h1>; } ...
2022-01-16 20:23:08
5302
原创 classnames:react官方推荐的动态引入类名的库
我们在react开发写scss时，可能会遇到要为一个标签动态添加多个类，但是在这个时候，原生的react会报错：<div className={styles.class1 styles.class2}</div> //报错这时候可以引用官方推荐的动态引入类的库：classnames。npm install classnames --save || yarn add classnames<Button className={classnames({ ...
2022-01-08 21:42:43
1055
转载 react-router-dom v5到v6改变了哪些属性
前言18 年初，React Router的主要开发人员创建一个名为Reach Router的轻量级替代方案。原来是相互抗衡的，却没想React Router直接拿来合并（真香！）目前v6已是测试最后一版，估计新的特性不出意外就是下面这些了： <Switch>重命名为<Routes>。 <Route>的新特性变更。 嵌套路由变得更简单。 用useNavigate代替useHistory。 新钩子useRoutes.
2022-01-04 16:09:22
555
原创 cookie、session、sessionStorage、和localStorage
一、cookie和session保持状态：cookie保存在浏览器端，session保存在服务器端2、使用方式：（1）cookie机制：如果不设置过期时间，cookie被保存在内存中，浏览器关闭而结束，这种cookie简称会话cookie。如果设置了cookie的过期时间，cookie被保存在硬盘中，关闭浏览器后，cookie数据仍然存在，直到过期时间结束才消失。Cookie是服务器发给客户端的特殊信息，cookie是以文本的方式保存在客户端，每次请求时都带上它（2）Sessio.
2021-09-23 19:35:25
179
原创 gitee基本使用（有点浅显）
https://npm.taobao.org/mirrors/git-for-windows/（下载链接，傻瓜式下一步下一步就行，放那个盘看你）1、建立远程仓库起个名写一写简介2、创建本地仓库，并向空的远程仓库传递代码现在本地的一个盘上新建一个空的文件夹当做本地仓库，点击Windows文件目录界面进入cmd在cmd中输入以下命令 git init git remote add origin <你的项目地址>就是这个 如果你想从远程仓库下...
2021-09-09 17:20:47
362
原创 js闭包是什么
闭包是js的一个难点也是它的一个特色，是我们必须掌握的js高级特性,闭包到底是什么呢？我们知道在es5中有两种作用域，全局和局部；根据我们对作用域链的理解，在内部作用域可以获得当前包含当前作用域的外层作用域下的变量，反之则不行。也就是说在外层作用域下无法获取内层作用域下的变量，同样在不同的函数作用域中也是不能相互访问彼此变量的，那么我们想在一个函数内部也有限权访问另一个函数内部的变量该怎么办呢？闭包就是用来解决这一需求的，闭包的本质就是在一个函数内部创建另一个函数。函数嵌套函数就形成了一个闭包：..
2021-09-08 15:13:30
176
原创 js继承方式
接口继承在 ECMAScript 中是不可能的，因为函数没有签名。实现继承是 ECMAScript 唯一支持的继承方式，而这主要是通过原型链实现的。1.原型链其基本思想就是通过原型继承多个引用类型的属性和方法。重温一下构造函数、原型和实例的关系：每个构造函数都有一个原型对象，原型有一个属性指回构造函数，而实例有一个内部指针指向原型。如果原型是另一个类型的实例呢？那就意味着这个原型本身有一个内部指针指向另一个原型，相应地另一个原型也有一个指针指向另一个构造函数。这样就在实例和原型之间构造了一条原型链。
2021-09-03 13:57:02
114
原创 原型模式配合构造函数的组合模式创建自定义类型
1.原型模式在原型对象上面定义的属性和方法可以被对象实例共享。原来在构造函数中直接赋给对象实例的值，可以直接赋值给它们的原型。function Person(){}Person.prototype.name = 'kunkun'Person.prototype.age = 19Person.prototype.gender = 'male'Person.prototype.sayName = function () { console.log(this.name);};var
2021-09-02 19:57:48
172
原创 自定义的构造函数是什么？
什么是构造函数？构造函数其实就是一个函数，只是用途和普通函数，不太一样（可以用来创建对象 ） 构造函数一般用于初始化对象//自定义构造函数function Person(name, age, gender) { this.name = name; this.age = age; this.gender = gender; this.sayName = function () { console.log(this.name); } }
2021-09-01 19:48:17
641
原创 javascript中this指向问题（es5）
与我们常见的很多语言不同，JavaScript 函数中的this指向并不是在函数定义的时候确定的，而是在调用的时候确定的。换句话说，函数的调用方式决定了this指向。JavaScript 中，普通的函数调用方式有三种：直接调用、方法调用和new调用。除此之外，还有一些特殊的调用方式，比如通过bind()将函数绑定到对象之后再进行调用、通过call()、apply()进行调用等。而 es6 引入了箭头函数之后，箭头函数调用时，其this指向又有所不同。 在方法中，this ...
2021-08-31 13:56:18
342
原创 Object原型属性及方法(原型方法，实例可以调用的方法)
在Object的构造函数的原型对象中的属性和方法都可以被Object构造函数的实例所继承。Object原型中的所具有的任何属性和方法也同样存在于其他对象中，任何对象继承自Object。Object 是所有构造函数的父构造函数，所有的构造函数都直接间接的继承Object。所有的实例对象都可以调用其构造函数及其父构造函数的原型中的方法Object.prototype.toString()Object.prototype.valueOf() ...1.obj的构造函数是Object，所以obj
2021-08-31 10:48:55
1179
1
原创 初识HTML
1.HTML与CSS1.1.什么是HTML？什么是CSS？HTML是HyperText Markup Language(超文本标记语言)不是编程语言 它不是一种编程语言，而是一种标记语言，用于告诉浏览器如何构造你的页面。它可以由一系列HTML元素组合成web开发人员想要的简单或者复杂的页面。“超文本”就是指页面内可以包含图片、链接，甚至音乐、程序等非文字元素。HTML也是一种规范，一种标准，它通过标记符号来标记要显示的网页中的各个部分。网页文件本身是一种文本文件，通过在文本文件中添加标记符，可
2021-08-31 10:36:46
416
原创 css3选择器的优先级和权重
优先级 作用:当多个选择器选中同一个标签, 并且给同一个标签设置相同的属性时, 如何层叠就由优先级来确定优先级判断的三种方式 -间接选中就是指继承 如果是间接选中, 那么就是谁离目标标签比较近就听谁的 -相同选择器(直接选中) 如果都是直接选中, 并且都是同类型的选择器, 那么就是谁写在后面就听谁的 -不同选择器(直接选中) 如果都是直接选中, 并且不是相同类型的选择器, 那么就会按照选择器的优先级来层叠 id>类>标签>通配符>...
2021-08-31 10:31:57
380
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人