当前位置: 首页 > news >正文

React Redux使用@reduxjs/toolkit的hooks

关于redux的学习过程需要几个官网,有redux官网,React Redux官网和Redux Toolkit的官网。
其中后者的中文没有找到,不过其中的使用在React Redux官网的快速入门中有介绍。
现在一般不使用connect借接口了。
对于借助Redux Toolkit的React Redux的应用示例可以看这个链接
https://blog.csdn.net/2202_75616310/article/details/134661399

注意:组件中使用state是从注册store的js的reducer里的key进行取用。useSelector((state) => state.counter2.value);这里的state是全局的state。
注册store的js

import { configureStore } from '@reduxjs/toolkit';
import counterReducer from '../features/counter/counterSlice';export default configureStore({reducer: {counter2: counterReducer,},
});

组件使用store的js

import React from 'react';
import { useSelector, useDispatch } from 'react-redux';
import { decrement, increment } from './counterSlice';
import styles from './Counter.module.css';export function Counter() {const count = useSelector((state) => state.counter2.value);const dispatch = useDispatch();return (<div><div><buttonaria-label="Increment value"onClick={() => dispatch(increment())}>Increment</button><span>{count}</span><buttonaria-label="Decrement value"onClick={() => dispatch(decrement())}>Decrement</button></div></div>);
}
http://www.lryc.cn/news/394454.html

相关文章:

  • Rejetto HFS 服务器存在严重漏洞受到攻击
  • Electron开发 - 如何在主进程Main中让node-fetch使用系统代理
  • vue2 webpack使用optimization.splitChunks分包,实现按需引入,进行首屏加载优化
  • 深入理解 Docker 容器技术
  • redis并发、穿透、雪崩
  • 【架构设计】-- ACK 机制
  • 这些网络安全知识,请务必牢记!
  • 学习笔记——交通安全分析11
  • Python 3 编程第一步
  • 【eMTC】eMTC 窄带以及带宽的关系
  • 【MySQL】mysqldumpslow工具 -- 总结慢查询日志文件
  • 【mindspore进阶】02-ResNet50迁移学习
  • 智能决策的艺术:揭秘决策树的奇妙原理与实战应用
  • 基于AOP的数据字典实现:实现前端下拉框的可配置更新
  • 基于CentOS Stream 9平台搭建RabbitMQ3.13.4以及开机自启
  • 9、Redis 高级数据结构 HyperLogLog 和事务
  • MyBatis(30)如何在 MyBatis 中使用 XML 和注解混合配置方式
  • 强化学习与控制模型结合例子
  • RKNN3588——利用推理YOLOv8推理图片
  • 【ARMv8/v9 GIC 系列 1.7 -- GIC PPI | SPI | SGI | LPI 中断使能配置介绍】
  • uniapp开发射击类小游戏
  • spring6框架解析(by尚硅谷)
  • Open3D 计算点云的马氏距离
  • Java事务(Transaction)
  • 算法 —— 二分查找
  • Mysql explain语句详解与实例展示
  • Python基础问题汇总
  • 【讲解下iOS语言基础】
  • 【网络安全】实验一(网络拓扑环境的搭建)
  • Docker-基础