react-redux使用 理解

1入口文件 引入 主组件

创建stroe 并且把reducers 传入到store

import React from 'react'

import { render } from 'react-dom'

import { createStore } from 'redux'

import { Provider } from 'react-redux'

import App from '../component/App'

import todoApp from '../redux/Reducers'

let store = createStore(todoApp);

render(

,

document.querySelector("#wrapper")

);

2创建一些文件统一管理 state action  reducers

然后创建Action.js 存放action

//定义一个change方法，将来把它绑定到props上

export function changes(value){

return{

type:"change",

value:value

}

}

创建 State.js 统一管理会用到的state

export function indexInput(state) {

return {

propsValue: state.same

}

}

创建Reducers.js 管理reducers

//reducer就是个function,名字随便你起，功能就是在action触发后，返回一个新的state(就是个对象)

export default function aa(state,action){

switch(action.type)

{

case 'change':

return{same:action.value};

break;

case 'test':

return{same:11};

break;

default:

return {same:'default'};

break;

}

}

3在主组件App.js 里面

import React, { findDOMNode, Component } from 'react';

import ReactDOM from 'react-dom';

import { connect } from 'react-redux';

import * as action from '../redux/Action'//action函数

import {indexInput} from '../redux/State'//state

export default connect(indexInput,action)(App);

通过connect 将APP 生成为容器组件，将state的指定值映射在props上，将action的所有方法映射在props上

indexInput：哪些 Redux 全局的 state 是我们组件想要通过 props 获取的？

action:哪些 action 创建函数是我们想要通过 props 获取的？