react-redux 传值 单向数据流是如何传值的

react-redux 数据传输：view-->action-->reducer-->store-->view 

    点击事件的数据如何通过redux传到view上，

    view 上的AddClick 事件 通过mapDispatchToProps 把数据传到action --->click:()=>dispatch(ADD)

    action 的ADD 传到reducer上

    reducer穿到store上 const store = createStore(reducer);

    store再通过mapStateToProps 映射穿到view上    text:state.text

import React from 'react';

import ReactDOM from 'react-dom';

import { createStore } from 'redux';

import { Provider, connect } from 'react-redux';

class App extends React. Component{

render(){

let { text, click, clickR } = this. props;

return(

< div >

< div >数据:已有人 { text } div >

< div onClick= { click } >加人 div >

< div onClick= { clickR } >减人 div >

div >

)

}

}

const initialState = {

text: 5

}

const reducer = function( state, action){

switch( action. type){

case 'ADD':

return { text:state. text+ 1}

case 'REMOVE':

return { text:state. text- 1}

default:

return initialState;

}

}

let ADD = {

type: 'ADD'

}

let Remove = {

type: 'REMOVE'

}

const store = createStore( reducer);

let mapStateToProps = function ( state){

return{

text:state. text

}

}

let mapDispatchToProps = function( dispatch){

return{

click :() => dispatch( ADD),

clickR :() => dispatch( Remove)

}

}

const App1 = connect( mapStateToProps, mapDispatchToProps)( App);

ReactDOM. render(

< Provider store = { store } >

< App1 > App1 >

Provider >, document. getElementById( 'root')

)