什么从redux中的reducer中捕获此返回语句?

时间:2016-12-22 09:08:15

标签: redux react-redux

在此示例中,我正在侦听DO_SEARCH操作类型并返回操作的有效内容。但是我想在捕获DO_SEARCH动作类型之后做一些事情,我不能在reducer中做,因为它必须是一个纯函数。

export default function (state=null, action) {
    switch(action.type){
        case 'DO_SEARCH':
           return action.payload;
           break;
    }
    return state; 
};

我的问题是究竟是什么吸引了这种回归?

说我有一个文本框和一个按钮。单击按钮后,我正在调用DO_SEARCH操作类型。有效负载实际上是文本框中的文本。那么我在哪里可以捕获我刚从reducer返回的有效负载?

我想在文本框中的文本上做一些事情。我在哪里实际放置这段代码?绝对不在reducers内,因为它们是纯函数。它是否在我实际实现逻辑的组件内部?

1 个答案:

答案 0 :(得分:1)

您可以在容器内处理您的状态。你的reducer做的是它返回你的状态,你可以使用mapStateToProps函数在容器中捕获它,并使用connect使该状态可用作组件的支柱,如

import 'reducerText' from '/path/to/reducer';
import {connect} form 'react-redux';

class App extends React.Component {
     constructor(props) {
         super(props);
      }
      render() {
         console.log(this.props.text);
         return (<div>Hello {this.props.text}</div>);
      }
}


function mapStateToProps(state) {
   return {
      text: state.reducerText
   }
}

export default connect(mapStateToProps)(App);