React
文章平均质量分 69
Might°
新人,多关照,哈哈哈哈~
展开
-
React useCallback如何使其性能最大化?
React中最让人畅谈的就是其带来的灵活性,可以说写起来非常的舒服。但是也就是它的灵活性太强,往往让我们忽略了很多细节的地方,而就是这些细节的东西能进行优化,减小我们的性能开销。可以说刚学React和工作几年后写React的代码真的是完全不一样。废话不多说了,今天带大家来了解useCallback有哪些细节之处可以让我们做进一步的性能优化。如果你不太了解useCallback......原创 2023-02-26 11:15:01 · 540 阅读 · 1 评论 -
关于为了少搬砖,而用node手写了一个React脚手架这件事
hellow,大家好。最近刚写完一个react项目,又想写一个练练手,可是我突然发现一个问题。那就是又要从零构建一个完整的项目环境,避免不了要重复搬砖搬砖还是搬砖,确实挺麻烦,可能得花费20多分钟。啥?我项目都还没写就花了我半小时?气愤之下,我立刻想了个好主意,我能不能用node写个脚手架呢?就像vue react它们的脚手架一样,直接运行vue create xxx 就直接把它那套模板搬过来了,可是我的明显是基于他们之上再结合自己日常项目需求所需的额外的包来搭建我们的项目。原创 2022-08-23 21:53:45 · 353 阅读 · 0 评论 -
解决antd side侧边栏菜单收缩时二级菜单不跟随
借用下图片,大概就是这种bug,直接看怎么解决吧,简单记录一下,有遇到相同问题的可以试试我这样的方法。我又回来了,BUG BUG BUG…核心代码都在上面,且有注释!原创 2022-08-19 16:17:35 · 1538 阅读 · 0 评论 -
react18+Ts+V6最新实战项目来袭!
看过我上一篇文章的应该知道最近在写一个后台管理系统,大概的技术栈是react18+ts+v6+antd。运用到的更多技术的看我下面的详细介绍,此项目是由B站千锋教育kerwin老师的产品,接口用的也是他们的。但是本项目与kerwin老师写的版本和技术都不同,只是基于接口与功能来实现。大家看看项目源码就一目了然了,如果完全不知道该如何下手建议可以去B站看看原版视频哦。原创 2022-08-19 15:53:11 · 2486 阅读 · 0 评论 -
react-router v6 如何实现动态路由?
最近在肝一个后台管理项目,用的是react18 + ts 路由用的是v6,当需要实现根据权限动态加载路由表时,遇到了不少问题。v6相比于v5做了一系列改动,通过路由表进行映射就是一个很好的改变(个人认为),但是怎么实现根据权限动态加载路由表呢?我也是网站上找了许多资料发现大部分还是以前版本的动态路由,要是按照现在的路由表来写肯定是不行的。难不成又要写成老版本那样错综复杂?只能自己来手写一个了,如有更好的方法望大佬们不吝赐教。...原创 2022-08-16 16:48:48 · 6728 阅读 · 13 评论 -
react-router-dom6 路由懒加载与组件懒加载
需要用到懒加载的组件:此时我这个组件默认是关闭的,类似于弹窗之类的,就需要最好做一个懒加载。这样就实现了组件懒加载,在我们需要将该组件懒加载的时候就采用lazy的方式导入即可。再配置一个过渡组件,就是等待我们懒加载的组件还没过来时运行此组件。我们会发现此时会加载一个文件,这个文件就是对应的懒加载文件。本文教学如何配置最新路由的懒加载 以及 组件懒加载。我这边是配置在index.tsx里面。第二个是加载路由组件的懒加载文件。第一个是加载组件的懒加载文件。说明我们成功实现了懒加载。点击控制懒加载组件显示。...原创 2022-08-09 15:46:16 · 1959 阅读 · 0 评论 -
redux 持久化(redux-persist) 结合 immutable 使用问题
最近学习了redux以及react-redux的结合使用确实让redux在react中更好的输出代码啦~但是考虑到项目的各种需求,我们还是需要对redux进行深一步的改造,让其能更好的满足我们的日常开发,大大提高我们的开发效率。今天给大家推荐两个好用的功能包,并解决一个它们结合使用存在的问题。...原创 2022-08-07 16:16:53 · 1700 阅读 · 0 评论 -
React 正确使用useCallback useMemo的姿势
简单给大家总结下useCallback 缓存函数useMemo 缓存函数返回值都是解决组件频繁渲染从而频繁创建函数及频繁运行函数正确的思路应该是 跟我有关的时候我才需要去重新创建函数及重新运行函数跟我无关的时候,直接拿上一次的缓存结果就行啦!求赞!!!...原创 2022-08-06 15:40:04 · 377 阅读 · 2 评论 -
Moment.js显示中文 React
Moment.js显示中文看了很多博客都是手动,教大家一种简单的方法就可以实现了。他内部其实有给我们提供很多语言包的,我们按需引入就可以了。大家可以看看,想要什么语言包可以自行切换就行了。修改的话我们直接在index入口文件中修改就行了import 'moment/locale/zh-cn';vue中要引用也是一样的道理!不详细说了...原创 2022-04-18 11:46:36 · 1164 阅读 · 0 评论 -
React 爷孙组件之间相互通信
前言最近在学习React,给大家总结下跨组件通信中,爷孙组件之间怎么相互通信。简单明了上代码直接一把梭,不多解释。爷孙组件间通信案例如下代码//跨组件通信import React, { Component } from 'react'//创建context 给初始值const UserMessage = React.createContext({ nickName: 'yyy', level: 1})export default class TextSingal e原创 2022-04-04 12:09:35 · 2330 阅读 · 2 评论