- 博客(94)
- 问答 (11)
- 收藏
- 关注
RSS订阅原创 【项目中的一些报错】记录
第一步：npm install autoprefixer@latest caniuse-lite@latest browserslist@latest --save-dev，结果还是不行。第二步： 第一步不行，就删掉node_modlues还有packjosan.lcok文件，重新npm install。运行 ‘npm install -g husky’ 来安装husky，然后再次尝试运行命令。全局安装npm install eslint babel-eslint -g即可。根据提示安装对象的node。
2023-12-05 09:57:29
630
原创 【vue踩坑】：SassError: This file is already being loaded
所以就是我在vue.config.js全局配置了，就不用再单独引入咯…根据提示，因为是说我已经全局引入变量了，不用在文件里单独引入了。
2023-11-23 16:50:07
833
原创 “index“ should always be multi-word
分析：组件名要以驼峰格式命名，自定义的要以loginIndex.vue等这种方式命名，防止和html标签冲突，所以命名index.vue 会报错。vue报错：Component name “index” should always be multi-word。
2023-11-21 16:40:06
235
原创 【踩坑】Putty报错: Can’t agree a key change algorithm
根据需要选择自己想要下载的版本，我是下载的如下图所示的版本。原因可能是putty版本太老了，更新putty就好了。
2023-11-09 09:15:48
344
原创 【CSS：基础】层叠上下文、盒模型和弹性布局
MDN解释：我们假定用户正面向（浏览器）视窗或网页，而HTML元素沿着其相对于用户的一条虚拟的Z轴排开，层叠上下文就是对这些HTML元素的一个三维构想。众HTML元素基于其元素属性按照优先级顺序占据这个空间。
2023-02-17 11:17:06
403
1
原创 nrm和nvm使用
安装下载：https://github.com/coreybutler/nvm-windows/releases。nrm use 切换镜像源，like: nrm use taobao。nrm是npm的镜像源管理工具。nrm可以在不同npm源之间切换。nvm install latest： 下载最新的node版本。nrm current 查看当前正在使用的镜像源。安装：npm install -g nrm。nrm ls 查看当前已添加的镜像源列表。nrm delete 删除源。nrm add 添加源。
2022-12-26 14:40:10
931
原创 【git：踩坑】请用git reset --soft HEAD^
简直是天坑，上周我在快要下班的时候提交代码，用了git reset --head HEAD^，虽然回退到之前的版本了，但也直接把之前的代码删除了……慎用，我当时是百度出来的，也没仔细看，就直接上手了，当时真的是脑壳晕了。但是这个只能回复提交了commit的，我当时有两个文件是没有commit的，也直接没有了，于是我只好手动ctrl+z，还好找回来了 T-T。git reset --hard HEAD^：删除工作空间的改动代码，撤销commit且撤销add。
2022-12-26 13:49:34
5665
2
原创 【基础恶补】JavaScript数组的一些方法，reduce，filter，reverse，map等
方法返回一个新的数组对象，这一对象是一个由 begin 和 end 决定的原数组的浅拷贝（包括 begin，不包括end）。会按照一个可指定的深度递归遍历数组，并将所有元素与遍历到的子数组中的元素合并成一个新数组返回。map 方法创建一个新数组，这个新数组由原数组中的每个元素都调用一次提供的函数后的返回值组成。负整数从数组中的最后一个元素开始。push() 将一个或多个元素添加到数组的末尾，并返回该数组的新长度。：一个新的、通过测试的元素组成的数组，如果没有符合条件的，则返回一个空数组。
2022-12-02 19:08:47
2178
3
原创 【TypeScirpt学习记录】二
但由于 JavaScript 中，对于 obj[prop] 形式的访问会将数字索引访问转换为字符串索引访问，也就是说， obj[599] 和 obj[‘599’] 的效果是一致的。因此，在字符串索引签名类型中我们仍然可以声明数字类型的键。any和unknown的最大区别：any放弃了所有类型检查，但是unknown并没有。never被称为Bottom Type，是整个类型系统层级中最底层的类型。可以将对象中的所有键转换为对应字面量类型，再组合成联合类型。索引签名类型：快速声明一个键值类型一致的类型结构。
2022-11-02 18:44:17
282
原创 【TypeScirpt学习记录】一
上面的code和status，确定了值的集合，可以获取精确的提示，因为一般code和status都是和后端约定好的一些固定值。，但是type会提示重复定义（interface可以定义多次，但同一个type只能定义一次）type将一个函数签名、一组联合类型、一个工具类型等等抽离成一个完整独立的类型。上文的status就是字面量类型，它比原始类型更为精确，可以分为一下几类。联合类型的常用场景之一是通过多个对象类型的联合。交叉类型继承的，interface是使用。根据vip类型来推导其他的类型。
2022-10-31 18:04:27
247
原创 【问题记录-next】地图next map-container.tsx?cb48:16 Uncaught ReferenceError: AMap is not defined
组件是自动判断是否加载高德地图SDK，如果全局存在AMap对象就不加在SDK，加载完成之后，全局会有window.AMap.用实例直接使用AMap对象，SDK没有开始加载，所以直接报错。在网上搜了很多方法都没有解决掉，最后发现，是我写法有问题……
2022-10-13 15:15:04
308
原创 【问题记录】next项目打包构建报错（npm WARN deprecated @babel/[email protected]）
npm WARN已弃用[email protected]: core-js@❤️.3不再维护，由于存在大量问题，不建议使用。请将您的依赖项升级到core-js的实际版本。更多信息请参见@babel/polyfill docs (https://babeljs.io/docs/en/babel-polyfill)。npm WARN notsup不支持引擎[email protected]: wanted: {“node”:“>=12.22.0”}(当前:{“node”:“12.18.3”，“npm”:“6.14.7”})
2022-10-13 14:34:06
2081
2
原创 【React: 踩坑】Warning: Function components cannot be given refs. Attempts to access this ref will fail.
这里的RgInput是其他人封装过的input框，后来我换成了antd的input也可以直接使用ref，不需要去包一层forwardRef了。我就想得到了在B框上使用ref，通过调用xxxRef.current?.focus()来实现这个小场景。套了一层forwardRef，并且有了第二个参数ref，在input上传入了ref={ref}有两个input框A、B，在A输入之后要进行校验，如果校验通过，自动聚焦到B的输入框……因为原来父组件通过ref获取了子组件的节点，子组件是函数式组件。...
2022-07-29 14:28:09
3569
1
原创 【面试准备：react】状态管理 mobx？redux?
核心原理：利用defineProperty或Proxy，实现数据的Observble，在get中收集依赖，set中触发依赖绑定的监听函数。mobx通过action去更改state在react组件中使用，observer：将状态和组件建立联系。有没有方法在项目开发中store只需一次注入？ 可以，使用Provider,inject，适用于class组件如果是hooks + mobx，可以使用useContext后续待补充...
2022-07-03 17:58:19
281
原创 【面试准备：react】hooks的原理
前言：renderWithHooks函数的作用是调用function组件函数的主要函数。function组件初始化：function组件更新：那么renderwithHooks做了些什么呢？在react-r econciler/src/ReactFiberHooks.js中回到原点，renderWithHooks函数的主要作用：1、置空workInProgress树的memoizedState和updateQueue，因为要把新的hooks信息挂载到这两个属性上，然后在组件的 commit阶段，将
2022-07-03 08:42:23
1221
1
原创 【面试准备：算法】二叉树
最近面试和刷算法题都有遇到二叉树，所以先浅浅浅学一下~ ，后续还要继续学习深入了解！！定义：二叉树有一个根节点，最多有两个子节点，一个左子节点，一个右子节点。满二叉树：每一层都是最大的结点，不能有空。完全二叉树：结点按照编号从左到右依次构建二叉树，不存在无左子节点，却有右子节点的情况二叉树的遍历更详细，可以参考这篇文章：【图解数据结构】树和二叉树全面总结...
2022-07-01 16:46:53
128
原创 【面试准备-react】React.memo和useMemo、useCallback的区别
1、前言2、定义：3、memo和useMemo的区别：1、react.memo()是一个高阶组件，我们可以使用它来包装不想重新渲染的组件，props没有变化，则不会冲性能渲染此组件2、useMemo是一个react hook,我们可以使用它在组件中包装函数。可以使用它来确保该函数中的值仅在依赖项之一发生变化时才重新计算4、定义：5、useMemo和useCallback的区别：1、useCallback优化针对于子组件渲染，返回值是函数。2、useMemo优化针对于当前组件高开销的计算。返回值是缓存
2022-06-28 20:17:43
1264
原创 charCodeAt() 方法了解和用法&unicode编码表
前言：最近在看一些算法题，发现有时候借用到charCodeAt方法，所以趁此机会来学习一下(●ˇ∀ˇ●)MDN的解释：W3C的解释：附链接：https://blog.csdn.net/fedawn/article/details/7307993
2022-06-24 18:19:06
4766
原创 【2022面试准备】变量类型检测
一、内存空间和类型内存空间分为： 栈内存和堆内存原始类型值被分配到栈内存中而引用类型被分配到堆内存中原始类型：string number boolean undefined null symbol bigInt引用类型：Object（包含object/function/array）二、如何判断类型：1、typeof ：可以判断原始类型，但是引用类型判断不了，除函数外所有的引用类型都会被判定为object2、instanceof： 可以判断引用类型具体是什么类型3、Object.prototyp
2022-06-13 19:34:39
102
原创 【2022面试准备】react中的setState和useState是同步还是异步？
1、setState会将多个调用合并为一个来执行，也就是说，当执行setState的时候，state中的数据并不会马上更新为什么要合并为一个来执行呢？ 看下段代码：如果没有react的优化机制，那么上面的setState执行100次，这个组件也会被更新100次。同步执行时useState也会对state进行逐个处理，而setState则只会处理最后一次那么合并的机制原理是什么呢？react用了事务机制，只要是在同一个事务中的 setState 会进行合并（注意，useState不会进行state的合并，
2022-06-08 17:28:06
5066
6
原创 Instance created by `useForm` is not connected to any Form element. Forget to pass `form` prop?
报错信息：warning: Instance created by useForm is not connected to any Form element. Forget to pass form prop?解决：在Modal上加属性： forceRender={true} destroyOnClose={false}参考链接： https://github.com/ant-design/ant-design/issues/21543...
2022-03-24 15:40:52
1323
原创 【面试1】构造函数、原型、原型链、new
1、什么是构造函数？如果一个函数被设计出来，是用于通过new关键字创建对象的，它就是一个构造函数。如下：function Father(name,age){ this.name = name; this.age = age;}构造函数有如下特征：（1）、首字母大写（2）、构造函数应该使用new来调用（3）、构造函数调用后，会返回一个对象（4）、构造函数的返回值若返回的值是一个数字、字符串、布尔，直接忽略，就当看不见。若返回的值是一个对象，则使用返回的对象（5）、构造函数中的
2022-02-09 22:23:12
266
原创 【react踩坑记录2】umijs中如何在首页中document.ejs引用全局变量
首先，在umijs中，document.ejs文件就对应index.html，官方原话：1、 新建 src/pages/document.ejs，umi 约定如果这个文件存在，会作为默认模板2、模板里可通过 context 来获取到 umi 提供的变量，context 包含：route，路由信息，需要打包出多个静态 HTML 时（即配置了 exportStatic 时）有效config，用户配置信息 比如：<link rel="icon" type="image/x-icon" h
2022-02-03 12:05:01
4784
1
原创 【react项目踩坑记录1】antd中table的rowSelection如何设置disabled
有一个需求是将antd中table的复选框直接禁用，查阅了antd文档后，我发现并没有相关的说明，最后查到一个方法，发现可以实现效果，即在rowSelection中加入getCheckboxProps方法，具体方法如下：rowSelection={ selectedRowKeys: selectedRoles, getCheckboxProps(value) { return { disabled: true, }; },}修改前：修改后：...
2022-02-03 11:52:07
2744
原创 [React Hook | useMemo、usecallBack] |学习记录
useCallback:把内联回调函数及依赖项数组作为参数传入 useCallback，它将返回该回调函数的 memoized 版本，该回调函数仅在某个依赖项改变时才会更新.useCallback(fn，deps) 相当于 useMemo(() => fn， deps)useMemo:把“创建”函数和依赖项数组作为参数传入 useMemo，它仅会在某个依赖项改变时才重新计算 memoized 值。这种优化有助于避免在每次渲染时都进行高开销的计算如果没有提供依赖项数组，useMemo 在每次渲
2021-10-20 18:28:08
126
原创 [Typescript 泛型学习] |学习记录
[Typescript 泛型学习] |学习记录泛型：类型变量：它是一种特殊的变量，只用于表示类型而不是值。泛型函数的两种使用方法：泛型接口：泛型类：泛型约束：泛型：类型变量：它是一种特殊的变量，只用于表示类型而不是值。function identity(arg: T): T { return arg; }T就是类型变量。我们把这个版本的identity函数叫做泛型，因为它可以适用于多个类型。泛型函数的两种使用方法：1、传入所有的参数，包含类型参数：使用了<>括起来而不是()let
2021-10-20 16:32:23
102
原创 $ git config credential.helper store
$ git config credential.helper store安装依赖包的时候，输入密码账号错误，再输入一次$ git config credential.helper store就可重新输入!太有用了！！npm cache clean -f 强制清除缓存，需要以管理员身份打开prowershellgit config --list 可以查询name和邮箱https://stackoverflow.com/questions/15381198/remove-credentials-fr
2021-09-18 14:56:25
2335
原创 CSS基础知识点
CSS基础知识点1、什么是盒模型？标准盒模型：box-sizing:content-box(W3C)IE盒模型：box-sizing：border-box(IE)2、行内、块级元素有哪些？行内：块级：区别如何取消行内元素的间隙？3、padding:1px2px3px;则等效于什么？4、什么是边距重叠？什么情况下会发生边距重叠？如何解决边距重叠？5、什么是BFC？如何触发BFC6、那么BFC的原理是什么呢？7、BFC的使用场景有哪些呢8、什么是高度塌陷，清除浮动？9、清除浮动的方法9、样式优先级10、css3
2021-08-29 19:00:00
631
原创 ES6的继承extends
挖个坑后面再弄懂。。。现在头晕ES6中的类与继承在E6里，实现类只需用Class关键字即可，实现继承也只需要用extends关键子字即可：class Person { constructor(name) { this.name = name } say() { console.log(this.name) }}class Student extends Person { constructor(name, id) { super(name); this.id = i
2021-08-24 11:13:48
388
原创 ES6中的Class语法糖
什么是classclass就是类，和ES5中的构造函数十分相似，绝大部分功能都是一致的，但是class的写法，能让对象原型的功能更加清晰，更加符合面向对象语言的特点。它是构造函数的另一种写法class Person {}typeof Person // "function"Person.prototype.constructor === Person // true使用通过new来生产一个实例class Person {}let json = new Person()con
2021-08-24 10:21:45
218
原创 javaScript的多种继承方式（8种）
这里写目录标题1、原型链继承2、 借用构造函数3、组合继承4、原型式继承5、寄生式继承6、寄生组合式继承7、混入方式继承多个对象8、ES6类继承extends1、原型链继承缺点： 多个实例对引用类型的操作会被篡改。2、 借用构造函数缺点：只能继承父类的实例属性和方法，不能继承原型属性/方法无法实现复用，每个子类都有父类实例函数的副本，影响性能3、组合继承缺点：在使用子类创建实例对象时，其原型中会存在两份相同的属性/方法4、原型式继承缺点： 原型链继承多个实例的引用类型属性指向相同，存
2021-08-23 19:58:04
293
原创 this指向，new关键字
一、this原则一般情况下谁调用他就指向谁，普通函数this：this永远指向 调用 包含 自己（this本身） 的 函数 对应的对象。1、 默认绑定非严格模式下 this 指向全局对象(浏览器下指向 Window，Node.js 环境是 Global ），严格模式下，this 绑定到 undefined ,严格模式不允许this指向全局对象。默认绑定的另一种情况在函数中以函数作为参数传递，例如setTimeOut和setInterval等，这些函数中传递的函数中的this指向，在非严格模式指向的
2021-08-23 18:01:05
227
原创 Error: Multiple configuration files found. Please remove one: - package.json
问题：如图，因为我在package.json和.babelrc文件中都配置了导致重复配置解决：在package.json或者.babelrc里保留一份配置即可
2021-07-01 18:37:34
882
原创 dependencies和devDependencies的区别
dependencies 生产环境 --savedevDependencies 开发环境 --save–dev , 一般安装本地调试的，如eslint等如果自己需要某一依赖，在安装时一定要使用npm install echarts --save或npm install echarts --save–dev，即将依赖配置到package.json中对应的对象中，而非简单使用npm install echarts命令（可以正常安装依赖，但不会配置到package.json文件中），因为如果是协作编程，p
2021-06-28 18:30:06
179
原创 前端性能优化——gzip压缩
背景：把js，css，图片等压缩，尽量减少文件的大小，提升响应速度压缩原理：客户端： 请求头中有个Accept-Encoding来标识对压缩的支持服务端：配置启用压缩，压缩的文件类型，压缩方式。当客户端请求到服务端的时候，服务器解析请求头，如果客户端支持gzip压缩，响应时对请求的资源进行压缩并返回给客户端，浏览器按照自己的方式解析，在http响应头，我们可以看到content-encoding:gzip，这是指服务端使用了gzip的压缩方式。如何查看是否压缩？content-encoding是g
2021-05-24 11:42:52
908
原创 mobx学习
Mobx：https://cn.mobx.js.org/intro/concepts.htmlMST文档：https://mobx-state-tree.js.org/intro/philosophyMST介绍参考文章：https://juejin.im/post/6844903772972384263Cerebral：https://cerebraljs.com/docs/views/angularjs.htmlMobx适合中小型项目1、js语法编写2、es6的装饰器写法babel插件：[
2021-05-10 10:05:16
307
原创 JavaScript 执行机制
JavaScript 执行机制前言因为JavaScript是一门单线程语言，所以我们可以得出结论：JavaScript是按照语句出现的顺序执行的。例子：setTimeout(function(){console.log(‘定时器开始啦’)});new Promise(function(resolve){console.log(‘马上执行for循环啦’);for(var i = 0; i < 10000; i++){i == 99 && resolve();}})
2021-05-10 10:01:10
99
原创 重绘和重排
重绘和重排？重排，又叫回流浏览器运行机制：–1、 构建DOM树 生成节点2、 构建渲染树 css3、 布局渲染树 确定渲染位置4、 绘制渲染树 开始渲染重绘： 一个元素外观的改变，会触发元素的重绘。如：color、background-color重排（回流、reflow）：元素的规模尺寸、布局、隐藏等行为改变而需要重新构建，这就称为回流重排必定引发重绘重排触发条件：1、 页面元素初始化2、 元素位置改变3、 添加删除可见的DOM元素4、 元素尺寸的改变—— 大小、外边距，边框
2021-05-10 09:59:08
210
空空如也
return的用法，代码优化
2022-09-05
React.FC是什么意思
2022-02-09
控制台不显示我的console.log
2021-09-22
npm install安装的时候报错
2021-09-17
请问能发我一个React DevTools吗？
2021-09-16
请问想要学习typescript，有推荐的书籍或者学习视频吗？
2021-09-15
请问typescript中的这个是什么意思？
2021-09-15
关于this的指向的一道面试题
2021-08-23
Vue.prototype.$定义全局变量后，为什么要用this.xxx才能使用
2020-12-23
vue中我定义的 环境变量打包后为什么获取不到了
2020-11-25
this.$router.push()跳转路由，前面拼接的是什么？
2020-11-03
vue项目打包，用nginx部署了，但是访问不到页面
2020-06-12
TA创建的收藏夹 TA关注的收藏夹
TA关注的人