- 博客(49)
- 收藏
- 关注
RSS订阅原创 Vscode 中新手小白使用 Open With Live Server 的坑
Vscode 中使用 Open With Live Server；打包dist文件 index.html 无法直接在浏览器中访问
2024-09-17 11:01:23
209
原创 Mac上安装 Node.js 的版本管理工具 n，以及 n 使用，的使用
于是我又实用 install 安装了 14.20.1，这时候我并没有再使用 use 去切换 node 版本，发现我的 node 版本既然神奇的自己切换到 14.20.1 这个版本了，于是我再次使用 use 去切换回 16.20.0 的版本，提示我却换成功，但是实际node却依旧是 14.20.1，也就是没有却换成功。最近刚更换 Mac 本进行项目的开发，刚上手 Mac 本还不是很熟练，需要安装 Node.js 的包管理工具。使用命令跟 nvm 差不多的，这里就罗列几个我常用的命令，其他的命令大家前官网看。
2024-01-05 21:47:16
4285
原创 yarn install 报错： info There appears to be trouble with your network connection. Retrying...
我出现问题的版本是 1.22.10，我手动降低了一个版本降到了 1.22.19，发现就可以正常安装依赖了，这里顺带贴一下命令。但是大家又会发现自己网络没有问题，于是开始怀疑镜像源。我的场景的我更换了镜像源依旧还是一样的提示，似乎不是镜像源的问题。大家在使用 yarn 拉包的时候，有时候可能会遇到上面的错误提示，大概意思就是 “你的网络连接似乎有问题。如果大家也跟我一样，不是网络问题，更换镜像源也依旧解决不了，大家可以尝试更换一下 yarn 的版本。
2023-12-04 10:26:12
4118
2
原创 Git装机基础配置
然后一路连续三次回车使用默认值即可。这之后你本机一定就会有 .ssh 目录了，里面有id_rsa和id_rsa.pub两个文件，这两个就是SSH Key的秘钥对，id_rsa是私钥，不能泄露出去，id_rsa.pub是公钥，可以放心地告诉任何人。最后，登录GitHub，拷贝id_rsa.pub文件的内容，设置秘钥。这样 git 装机最基础的配置就OK了，你就可以拉代码 推动代码了。Git在开发中可谓是必用的工具软件了，下面介绍下装机必须的几个配置。
2023-07-10 21:47:51
2445
原创 06-redux中的hook
在类组件中，我们要获取redux中的数据，使用的方法是先引入 connect高阶函数，传入一个 mapStateToProps作为其参数，并在mapStateToProps函数中将redux中的值返回出去，以这样的的形式来获取redux中的数据。在函数组件中，提供了一种比上面使用起来更加方便的方式，也就是使用redux中的一些hook函数来实现redux中数据的获取。在函数组件中，使用Provider包裹根组件，并将store注入这一步，依旧是不能少的。在函数组件中要和redux连接，分为两个步骤。
2023-03-07 22:01:47
1210
原创 05-路由中的Hook
获取 location 对象，location 对象提供了路由的一些描述相关信息；：获取 history 对象， history 对象提供了路由的跳转方法；获取到的关于路由的相关方法和数据，在函数组件中还是可以继续通过参数。同样的，在类组件中，如果我们需要非路由组件，需要使用。：获取动态路由的参数对象；提供路由传递的一些参数。
2023-03-07 22:01:15
593
原创 04-useMemo 、React.memo、useCallback
缓存数据，模拟 Vue 中的计算属性。同样useMemo跟vue中component一样，也是有缓存的，会将结果缓存下来。
2023-03-07 21:58:56
436
原创 02-useState、useRef
这个函数，来解决函数组件中不能设置状态的问题。方法的作用和语法都是一样的。这个 hook 方法和。React 中提供了。
2023-03-07 21:56:27
116
原创 01-关于hook
在 React 16.8 版本以前，函数组件也称为“无状态组件”。即函数组件中不能使用 state，也不能使用生命周期函数。从 16.8 开始，React 中新增了 Hook，专门用来解决函数组件的一些问题。从代码层面来看，Hook 实际上就是一组函数，每一个函数都用自己的功能。
2023-03-07 21:55:03
100
原创 Ant Design Pro项目中 提示：找不到模块“@ant-design/pro-components”或其相应的类型声明
Ant Design Pro项目中 提示：找不到模块“@ant-design/pro-components”或其相应的类型声明
2023-03-07 10:03:59
11412
原创 Antd的table组件自定义筛选菜单的使用
table组件可以对每列设置筛选，也可以自定义筛选项，这里记录一下自己在一次开发中对自定义筛选项的使用。
2022-11-12 20:53:26
2812
原创 position: fixed；吸底按钮以及吸底按钮挡住内容解决办法
但是有的时候，这个吸底按钮可能会挡住内容，那么这个时候可以通过对其最外层的父盒子，或者自己套一个父盒子设置 padding-bottom 属性，再调整 padding-bottom 属性的值到合适位置就OK了。在开发中，吸底或者吸顶按钮很常见，都是通过设置position: fixed，然后控制bottom的距离来实现。
2022-10-07 18:10:59
1332
原创 React脚手架创建项目，跨域问题处理
配置之后，请求的url中需要添加/api这样就会把以"/api"开头的请求，代理到实际要请求的。1、首先在src下面新建setupProxy.js文件然后进行如下的配置。文件，那么也可以使用http-proxy-middleware来实现。一、使用http-proxy-middleware来实现。...
2022-06-29 22:09:45
748
原创 antdPro创建的项目网络请求统一处理
方式二是最近看umi文档时候发现的，可以直接在antdPro项目的app.tsx文件中对request进行运行时配置，并且该配置会直接透传到umi-request的全局配置。在React中经常会使用到umi提供的request请求。那么在antdPro创建的项目中，怎么对request请求进行统一的封装呢？是对umi的request进行简单封装，再暴露出去；项目中经常会对请求进行统一的封装处理，方便我们搭载token、对请求进行拦截等需求。...
2022-06-12 18:37:41
1607
原创 umi-request请求封装
request是umi中内置的网络请求的方法，基于fetch封装,在开发中，一般都会对请求进行封装，统一设置一些属性。在request中有些通用的配置我们不想每个请求里都去添加，那么可以通过。更加详细的umi-request介绍可以参考文档。...
2022-06-12 16:00:20
5750
1
原创 [React Intl] Missing message: “menu.管理页“ for locale: “zh-CN“, using default message as fallback.
ReactIntl]Missingmessage"menu.管理页"forlocale"zh-CN",usingdefaultmessageasfallback.使用react-pro搭建的项目，默认会开启国际化配置，上面的警告提示就是项目中缺少警告中提到的路由页面的一些国际化配置，往往国际化在项目中可能使用不到，关闭即可。在项目config/defaultSettings.ts文件中进行相关配置。...
2022-05-28 18:22:46
3250
3
原创 Syntax Error: Error: Missing binding C:\Users\ASUA\Desktop\wangyiyun-app\node_modules\node-sass\vend
vue项目启动报如上错误，是由于node-scss与node版本有冲突导致重新 npm i node-sass 安装一下node-scss包即可
2022-05-12 23:05:56
4682
原创 AntdPro中-ProFormSelect组件的使用说明
AntdPro是对antd又进行了一次封装，相比antd使用起来方便了许多。但是最近初次使用的时候，还是踩了很多坑，这里就记录一下：对于带搜索功能的select选框，是比较常用的，但是这次在说使用的时候，选中了选项之后并没有清空搜索框，也就是下图这样的情况：其实熟悉antd的朋友都知道，配置 autoClearSearchValue:true, 即可，但是我给了autoClearSearchValue属性之后，会有错误抛出，会提示你ProFormSelect上没有autoClearSearch.
2022-04-09 16:51:41
13274
4
原创 js中遍历对象，同时得到key与value的几种方法
1、Object.keys()const testData = { name: '小王', age: '永远年轻',}Object.keys(testData ).map(key => { console.log(testData[key]) })//Object.keys() 返回对象自身的所有可枚举的属性并以数组形式返回 即:[name,age]//Object.values() 返回对象自身所有可枚举的属性值,并以数组形式返回：[小王,永远年轻]2、使用
2022-04-06 22:41:47
15279
1
原创 git--分支重命名操作
本地分支是指：你当前这个分支还没有推送到远程的情况，这种情况修改分支名称就要方便很多。远程分支是指：假设你当前已经将该分支推送到远程了，这种情况修改起来要稍微多几步。4.修改后的本地分支关联远程分支。3.上传新修改名称的本地分支。1.先重命名本地分支。
2022-04-06 21:22:45
25795
5
原创 Antd--翻页组件一左一右显示
在开发中，可能经常会遇到table的翻页组件一左一右展示的情况，也就是total展示在最左边，翻页按钮展示在做右边，也就是下面这种展示方式刚开始找了table以及一些pagination的配置项说明，以为有直接的配置属性可以实现这样的展示效果，但是找了一下没有找到。不过也没有关系，这样的展示效果，实现也超级简单，记录一下，怕自己日后忘记。...
2022-03-29 21:46:04
929
原创 React脚手架创建项目报错 You are running `create-react-app` 4.0.3, which is behind the latest release (5.0.0)
主要原因是React脚手架版本不是最新的导致的，那么解决方式很简单就是卸载之前的脚手架，再重新安装新的脚手架，安装成功之后，就可以正常创建项目。在创建React项目时，提示如下错误信息。1、卸载之前创建安装的脚手架。2、再安装脚手架创建新项目。...
2022-03-07 22:25:16
1055
1
原创 js中继承的几种方式
js中继承的几种方式什么是继承？继承是指一个类能够使用另一个类的属性和方法。被继承的那个类称为父类，继承父类属性和方法的那个类叫做子类，即子类能够使用父类里的属性和行为。继承的几种方式一、原型链继承特点：属性是共享的，如果属性中有引用数据类型，那么修改其中一个，另外一个也会修改。实现方式：在要继承的子类的原型上面赋值为父类的实例化 例子如下： //父函数 function Parent(name,age) { this.name =
2022-03-05 10:52:48
835
原创 几种数组扁平化方式
数字扁平化可能在日常的工作中会用到，下面有几种扁平化的方式，收集起来，方便之后使用 <script> /** 方式一：使用原型的isPrototypeOf()方法，结合递归实现 isPrototypeOf() 用来检测一个对象是否存在于另一个对象的原型链中，如果存在就返回 true，否则就返回 false 如果存在于另一个对象的原型链中就继续调用方法 fn，如果不存在就直接push到用来存放的数组里面
2022-02-27 20:00:08
396
原创 Vue中过滤器的使用
Vue中如何定义filter过滤器，如何使用过滤器。使用场景vue中过滤器的作用可被用于一些常见的文本格式化，例如：价格前面加上人民币符号（¥）、大小写转换、字符串截取等分类:全局过滤器 和 局部过滤器当全局过滤器和局部过滤器重名时，会采用局部过滤器。过滤器都可以在哪些地方使用呢？过滤器只能在mustache（插值表达式，双花括号）和v-bind中使用使用//定义全局过滤器//全局过滤器的定义在 main.js文件中进行，且要在创建 Vue 实例之前全局定义过滤器
2022-02-22 19:53:43
931
原创 Vue中插槽的使用
Vue中插槽的使用一、为什么要使用插槽：使用插槽的目的在于，使组件更具有扩展性。例如，组件中的一个地方，默认情况下为botton，而在使用的时候，我们有需求需扩展成span、input等，这时候我们就要用到插槽。并且我们可以将共性抽取到组件中，将不同暴露为插槽。一旦我们预留了插槽，就可以让使用者根据自己的需求，决定插槽中插入什么内容。二、插槽是vue中的内容分发机制，slot又分三类：默认插槽、具名插槽、作用域插槽。三、slot插槽的使用：子组件预留slot位置，父组件在使用
2022-02-20 21:56:17
2759
原创 Vue中将input输入的小写字母转换成大写，并实时显示在input输入框上面
思路：input输入框有个change事件，调用change事件获取到input输入的值，再在$nextTick中调用 toUpperCase方法，将其转换成大写change：({value,column})=>{ this.$nextTick(()=>{ this.obj.socialCreditCode = value.toUpperCase(); }}...
2022-02-14 15:08:58
3620
原创 Avue--crud组件，分页中page属性根据接口返回的数据改变,页面没更新问题
avue的crud组件，走后台请求了数据，根据后台返回的page数据修改crud的page数据后，发现页面的总条数、页码等数据并没有变化。由于请求数据走了异步方法，所以需要在page后加一个sync事件修饰符： <avue-crud ref="dytttcrud" //:page="page" :page.sync="page" :data="listData" @size-change="sizeCh
2022-02-14 13:50:00
8777
5
原创 Vue中设置浏览器标签栏图标以及title
1、设置浏览器标签栏图标使用脚手架创建的项目，已经将标签栏图标设置好了，默认的是vue的图标。如果需要修改，只需要将public文件夹下面的favicon.icon文件替换为我们自己的图标即可2、浏览器标签栏title修改title的修改有很多种方法，我使用的是路由配置中的路由元信息结合路由导航钩子来实现的import Vue from 'vue'import VueRouter from 'vue-router'import Login ...
2022-02-12 23:16:26
12315
2
原创 yarn : 无法加载文件 C:\Users\HYGK\AppData\Roaming\npm\yarn.ps1，因为在此系统上禁止运行脚本。有关详细信息，请参阅 https:/go.microsof
出现上诉问题，需要更改计算机上的执行策略，解决办法如下：1、搜索powershell，右键以管理员身份运行2、输入命令，将计算机上的执行策略更改为 RemoteSigned执行：set-ExecutionPolicy RemoteSigned 再输入： y3、再输入命令查看执行策略是否为RemoteSigned 执行：get-ExecutionPolicy4、关闭命令窗口 即可正常使用...
2022-02-08 17:53:05
690
1
原创 js-file-download 插件使用 Excel导出
1、npm安装npm install js-file-download2、在需要使用的地方引入 js-file-download插件import fileDownload from 'js-file-download';3、具体使用//download.jsimport request from '@/utils/axios'export function download(query) { return request({ url: '/admin/fi
2022-02-08 11:40:04
1531
原创 vue路由匹配上之后，但页面空白的问题
在vue项目中，可能会遇到路由匹配上之后，页面空白没有内容的情况，就像下面截图所示：于是就查看了一些其他朋友对该问题的回答，主要有下面几点：1、路由配置重复，如果配置了两个重复的路由，比如配置了两个【path: '/'】，那么访问就会看到空白页面，这时候改下重复的路由配置即可。2、访问的页面没有配置路由，那么访问的页面也可能是空白页，比如访问/test，但是路由里却没有配置，也不会出现页面。但是我排查了上面这两点，发现都不存在上面两点的问题，但是页面还是不出来。后来仔细排查发现问题.
2022-01-30 21:16:58
15401
3
原创 项目中初始化引入npm或uniapp项目中使用npm
在非脚手架创建的项目中，有时需要使用npm包管理工具，例如在uniapp项目中。如果需要使用到npm，使用步骤如下：1、初始化npm//打开项目的终端，在终端中输入如下命令进行npm的初始化：npm init -y//这样项目根目录下就会出现 node_modules 文件夹//如果此时没有出现，那么在后面的下载依赖后，根目录下就会出现 node_modules 文件夹2、下载所需要的依赖包（这里以下载axios为例）npm install axios此时项目根目录
2022-01-27 10:38:50
3598
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人