react redux是什么?


本文摘自PHP中文网,作者藏色散人,侵删。

React-Redux是Redux的官方React绑定库。它能够使你的React组件从Redux store中读取数据,并且向store分发actions以更新数据。

安装

在你的React app中使用React-Redux:

1

npm install --save react-redux

或者

1

yarn add react-redux

简言之,react-redux是一个轻量级的封装库,核心方法只有两个:Provider和connect。

React-Redux 提供<Provider/>组件,能够使你的整个app访问到Redux store中的数据:

1

2

3

4

5

6

7

8

9

10

11

12

import React from "react";

import ReactDOM from "react-dom";

import { Provider } from "react-redux";

import store from "./store";

import App from "./App";

const rootElement = document.getElementById("root");

ReactDOM.render(

  <Provider store={store}>

    <App />

  </Provider>,

  rootElement

);

React-Redux提供一个connect方法能够让你把组件和store连接起来。

通常你可以以下面这种方式调用connect方法:

1

2

3

4

5

6

7

8

9

10

11

12

13

import { connect } from "react-redux";

import { increment, decrement, reset } from "./actionCreators";

// const Counter = ...

const mapStateToProps = (state /*, ownProps*/) => {

  return {

    counter: state.counter

  };

};

const mapDispatchToProps = { increment, decrement, reset };

export default connect(

  mapStateToProps,

  mapDispatchToProps

)(Counter);

相关推荐:《javascript教程》

以上就是react redux是什么?的详细内容,更多文章请关注木庄网络博客

相关阅读 >>

React创建组件的三种方式分别是什么

React中monent如何获取日期?

React怎么实现锚点滚动

React设置文件路径别名的具体方法你知道么

React中怎么改变state的值

React移动端框架有哪些

React是mvvm框架吗

React native是什么

使用React怎么遍历数组

React如何写点击事件

更多相关阅读请进入《React》频道 >>




打赏

取消

感谢您的支持,我会继续努力的!

扫码支持
扫码打赏,您说多少就多少

打开支付宝扫一扫,即可进行扫码打赏哦

分享从这里开始,精彩与您同在

评论

管理员已关闭评论功能...