redux总结兼开发者工具

Redux简介
使用Hook实现功能(不使用redux)
Redux三大核心概念➕ 完整版代码(未优化)
Redux异步action
react-redux库
react-redux数据共享

总结:

——合并reducers,单独写成一个文件

在这里插入图片描述

—— 继续简写:改变reducer命名

在这里插入图片描述

—— 由于键值同名,继续简写

在这里插入图片描述

—— store.js文件夹只需引用汇总后的reducer

在这里插入图片描述

—— 总结

在这里插入图片描述

开发者工具

一、在开发者工具中的扩展程序中安装Redux DevTools开发者工具
二、之后在命令行中输入以下内容,安装对应的库

tnpm i redux-devtools-extension

三、在store.js中引入下载的库

/*
    该文件专门用于暴露一个store对象,整个应用只有一个store对象
*/
// 引入createStore,专门用于创建redux中最为核心的store对象
import { createStore, applyMiddleware } from 'redux'
// 引入为Count组件服务的reducer
import CountReducer from './count_reducer'

//  引入redux-devtools-extension
import { composeWithDevTools } from 'redux-devtools-extension'
// 引入redux-thunk,用于支持异步action
import thunk from 'redux-thunk'
// 暴露store
export default createStore(
    CountReducer, 
    composeWithDevTools(applyMiddleware(thunk))
    // 如果没有异步,就写成这样
    // composeWithDevTools()
)

在这里插入图片描述

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值