美文网首页
React - Redux

React - Redux

作者: 蓝浅蓝深 | 来源:发表于2017-06-05 10:30 被阅读4次

首先在最外层容器中,把所有内容包裹在 Provider 组件中,将之前创建的 store 作为 prop 传给 Provider。

const App = () => {
    return (
        <Provider store={store}>
            <Comp/>
        </Provider>
    )
};

Provider 内的任何一个组件(比如这里的 Comp),如果需要使用 state 中的数据,就必须是「被 connect 过的」组件——使用 connect 方法对「你编写的组件(MyComp)」进行包装后的产物。

class MyComp extends Component {
    // content...
}
const Comp = connect(...args)(MyComp);

connect 会返回一个与 store 连接后的新组件。那么,我们就可以传一个 Presentational Component 给 connect,让 connect 返回一个与 store 连接后的 Container Component。

注意:与 Vue.Store 不同,并非在根节点 connect 后自动注入所有子节点,任何组件要使用 state 数据,都必须要 connect !!!

相关文章

  • Redux for ReactNative (二)

    安装 React Redux Redux不包含React库,需要单独安装React 绑定库 react-redux...

  • redux

    单独使用redux redux是核心库 与react配合使用redux 安装react-redux react-r...

  • 两张图看懂 React Redux 架构和数据流

    React 技术栈 React - 视图层Redux - 状态、数据层React-Redux - 连接Redux-...

  • redux note(一)

    redux 搭配 React使用 Redux和React之间没有关系,Redux支持React, Angular,...

  • react-redux

    一、什么是react-redux React-Redux是Redux的官方React绑定。 它允许您的React组...

  • redux的简单应用

    1、安装 redux和react-redux: npm i redux react-redux --save-de...

  • Redux简介

    Redux React-redux React-router Redux 1、基本用法: Redux中存在几个概念...

  • redux基础

    Redux react-redux React-router Redux 1、基本用法: Redux中存在几个概念...

  • 前端数据流之Redux篇(案例)

    create-react-app cartnpm i redux react-redux redux-thunk ...

  • react-redux

    使用react-redux,可以更方便的使用redux开发 先install react-redux使用react...

网友评论

      本文标题:React - Redux

      本文链接:https://www.haomeiwen.com/subject/fzkifxtx.html