仲灏小栈 仲灏小栈
首页
大前端
后端&运维
其他技术
生活
关于我
收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

仲灏

诚意, 正心, 格物, 致知
首页
大前端
后端&运维
其他技术
生活
关于我
收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • 《前端项目基础建设》
  • HTML&CSS

  • JavaScript&TypeScript

  • Node

  • 构建

  • Vue

  • React

    • Vue 放弃繁琐的render函数,拥抱JSX
    • Awesome React
    • React 文档(vue版)
    • react 项目开发注意事项
    • 常见功能实现
    • react 常见坑集合
    • ant design pro 学习
    • ProComponents设计思路
    • 万条数据渲染优化
    • react hook 与 闭包
    • JSX
    • React生命周期
    • React 基本使用 setState
    • React 基本使用 组件生命周期
    • React 高级使用 性能优化
    • React 高级使用 高阶组件
    • React Redux使用
      • 基本概念
      • 单项数据流
      • react-redux
      • 异步action
      • 中间件
        • 示例
    • react-router 使用
    • React 原理
    • React 面试题1
    • React 面试题2
    • React 面试题3
    • React 面试题5
    • 仿jira项目笔记 项目起航:项目初始化与配置
    • 第6章 CSS 其实很简单 - 用 CSS-in-JS 添加样式
    • 第8章 Hook,路由,与 URL 状态管理
    • pro-components 源码学习
    • ant-design Spin组件封装
    • React 生命周期
  • 小程序

  • 跨端

  • Electron

  • WebGL&GIS

  • 浏览器

  • 面经

  • 其他

  • 大前端
  • React
仲灏
2022-07-03
目录

React Redux使用

# 基本概念

  • store state
  • action
  • reducer

# 单项数据流

  • dispatch(action)
  • reducer -> newState
  • subscribe 触发通知

# react-redux

  • connect
  • mapStateToProps mapDispatchToProps

# 异步action

image-20220703180857065

image-20220703180820475

  • redux-thunk
  • redux-promise
  • redux-saga

# 中间件

image-20220703181147983

# 示例

import { applyMiddleware, createstore } from ' redux";
import createLogger from redux-Logger';
import thunk from redux-thunk:
const Logger = createLogger();
const store = createStore(
  reducer,
  applyMiddleware(thunk, logger) // 会按顺序执行
)




//自己修改 dispatch,增加 Logger
Let next = store.dispatch;
store.dispatch = function dispatchAndLog (action) {
  console. Log('dispatching', action):
  next (action);
  console. log('next state', store.getState());
}
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
#大前端#React#周边工具#react-redux
上次更新: 2022/08/14, 18:25:44
React 高级使用 高阶组件
react-router 使用

← React 高级使用 高阶组件 react-router 使用→

最近更新
01
vim日常使用记录
04-02
02
滑动窗口最大值
04-02
03
有效的字母异位词
04-02
更多文章>
Theme by Vdoing | Copyright © 2021-2025 izhaong | github | 蜀ICP备2021031194号
  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式