gdux-react

根据提供的引用内容，gdux-react是一个错误的拼写，正确的应该是"redux-react"。Redux-React是一个用于在React应用程序中集成Redux状态管理库的库。它提供了一些功能来简化Redux在React组件中的使用。

以下是Redux-React的一些基本使用方法[^1]：
1. 安装Redux和React-Redux库：

yarn add redux react-redux

2. 创建Redux store并配置Redux DevTools扩展：

import { createStore, applyMiddleware } from 'redux';
import { composeWithDevTools } from 'redux-devtools-extension';
import thunk from 'redux-thunk';

const store = createStore(allReducer, composeWithDevTools(applyMiddleware(thunk)));

3. 在React组件中使用Redux状态：
- 使用`connect`函数将组件连接到Redux store：

import { connect } from 'react-redux';

const MyComponent = ({ data }) => {
  // 使用从Redux store中获取的数据
  return (
    <div>
      {data}
    </div>
  );
};

const mapStateToProps = (state) => {
  return {
    data: state.data
  };
};

export default connect(mapStateToProps)(MyComponent);

- 使用`mapDispatchToProps`函数将操作状态的方法传递给UI组件：

import { connect } from 'react-redux';
import { increment } from './actions';

const MyComponent = ({ count, increment }) => {
  // 使用从Redux store中获取的数据和操作状态的方法
  return (
    <div>
      <p>Count: {count}</p>
      <button onClick={increment}>Increment</button>
    </div>
  );
};

const mapStateToProps = (state) => {
  return {
    count: state.count
  };
};

const mapDispatchToProps = (dispatch) => {
  return {
    increment: () => dispatch(increment())
  };
};

export default connect(mapStateToProps, mapDispatchToProps)(MyComponent);