react
一切随你啦
这个作者很懒,什么都没留下…
展开
-
react hooks下封装通用redux
redux我们常用来做全局状态管理,一般我们都会按功能模块来新建相关的action,reducer然后再使用combineReducers来将其组合导出,这样的话就实现了模块的划分,让我们更方便项目的管理。但是在某些情况下,我们想要一个通用的redux管理,比如一些特别小,但是又必须要用到的场景,比如我们现在新建了一个chat模块用来管理聊天相关的redux,新建了一个menu模块来管理我们的菜单模块,新建了一个number模块用来管理我们的数据状态,但是这时候我想要对顶部导航栏的显示与隐藏添加一个redu原创 2020-07-14 19:24:07 · 493 阅读 · 0 评论 -
react hooks 下使用redux
reduxredux是近年来javascript中火热的状态管理容器,提供可预测的全局状态管理。在大型的应用中我们常采用redux来进行状态管理,redux的基本使用方式如下使用redux,我们先要进行action的编写,action一般由type与其他相关数据构成,下面就是简单的两个actionconst INCREMENT = 'INCREMENT'const DECREMENT = 'DECREMENT'// 数字增加action{ type: INCREMENT, payload:原创 2020-07-14 18:00:13 · 6131 阅读 · 1 评论 -
从零搭建一个react-hooks项目(二)
上一篇搭建了基本的webpack项目,可以支持react,less的基本使用,但是没有考虑到项目中的实际情况,例如生产环境的代码混淆,代码压缩,开发环境的热启动等。下面我们就针对开发与生产环境的不同需求,对webpack进行下一步的配置生产环境的配置与开发环境的配置有很多的不同点,所以我们需要分别建对应的配置文件,在根目录下分别创建 webpack.prod.js(生产配置) 与webpack.dev.js(开发配置)然后在package.json中的scripts里新建两个命令,分别是 “buil.原创 2020-07-06 14:32:05 · 817 阅读 · 0 评论 -
从零搭建一个react-hooks项目(三)
从零搭建一个react-hooks项目(三)上一篇我们配置了项目相关,包括代码压缩混淆,开发生产配置抽离,图片与文字的引入使用等接下来我们就配置一下react-router,react-redux与typescript配置之前我们先补充一下webpack的部分配置,用于方便我们的开发在webpack.common.js中配置webpack的查找规则,也就是resolve,如下...module.exports = { entry: { ... }, module: {原创 2020-07-06 14:31:02 · 891 阅读 · 0 评论 -
从零搭建一个react-hooks项目(一)
从零搭建一个react-hooks项目(一)最近有打算仿vue-admin项目构造一个react的项目,不引用官方脚手架,从webpack开始配置一套基于react,redux,typescript的项目,并实时记录一下项目中的一些配置情况首先搭建一个基本的webpack环境webpack项目搭建前置基础,电脑有安装node环境,可以使用npm工具新建文件夹,命名项目名称(react-admin),进入文件夹,使用命令 npm init ,然后一路确定生成package.json文件web原创 2020-06-16 17:48:55 · 3359 阅读 · 0 评论