React Native:在mapStateToProps中将数据附加到Prop

时间:2018-05-30 22:00:57

标签: reactjs react-native redux react-redux

我有一个叫做“数据”的道具,它最初填充了数据记录到应用程序加载状态。我试图做的是基于我在mapDispatchToProps中触发的函数附加到“数据”道具。

目前代码如下:

class ListScreen extends React.Component {
  static navigationOptions = {
    header: null,
  };

  static propTypes = {
    navigation: PropTypes.object.isRequired,
    data: PropType.isRequired,
    nextBatchOfData: PropTypes.func,
  };

  getData = () => {
    this.props.nextBatchOfData({ some, search, params });
  };

  render() {
    const { data } = this.props;

    return (
      <View style={styles.container}>
        <ScrollView>
          <StatusBar barStyle="default" />
          <FlatList
            data={data}
            keyExtractor={({ id }) => `${id}`}
            numColumns={2}
          />
        </ScrollView>
      </View>
    );
  }
}

const mapStateToProps = state => {
  return {
    data: [...dataSelectors.getOfferResults(state)], // Attempting to append to existing state..
  };
};

const mapDispatchToProps = dispatch => ({
  nextBatchOfData: searchParams => dispatch(actions.dataSearch.request(searchParams)),
});

运行getData()功能时,nextBatchOfData()道具将会启动。但是,之前的状态会被覆盖。有没有办法解决这个问题?

以下是我的减速机的一部分,我将收回数据:

[combineActions(actions.dataSearch.success, actions.dataSearch.fail)]: (
      state,
      { payload, meta, error }
    ) => {
      const hasResults = payload && !error;
      return {
        ...state,
        isLoading: false,
        error: error && payload.message,
        results: hasResults ? payload : state.results,
      };

1 个答案:

答案 0 :(得分:0)

我认为最好的方法是使用减速机。

您将state可用,因此附加信息将更自然地在那里完成。