将回调函数传递给子组件,不是函数错误

时间:2019-07-10 08:57:48

标签: javascript reactjs react-redux

当我尝试从子组件中分派动作时,出现错误_videos.filteredVideo) is not a function。如何将action传递给子组件?

我有这个容器组件:

class SearchScreen extends React.Component {

  filterVideo = payload => {
    filteredVideo(payload);
  };
  render() {
    return (
      <View style={styles.container}>
        <Search {...this.props} filterVideo={this.filterVideo} />
      </View>
    );
  }
}

const mapDispatchToProps = dispatch => ({
  filteredVideo: () => dispatch(filteredVideo())
});

const mapStateToProps = state => {
  return {
    videos: state.videos
  };
};
export default connect(
  mapStateToProps,
  mapDispatchToProps
)(SearchScreen);

子组件:

  filteredVideo = filteredData => {
        const { filterVideo } = this.props;

        filterVideo(filteredData); //_videos.filteredVideo) is not a function
    };

    filterList = event => {
        let videos = this.state.initialVideos;

        let {
            nativeEvent: { text }
        } = event;
        let filteredData = videos.filter(item =>
            item.title.toLowerCase().includes(text.toLowerCase())
        );

        this.filteredVideo(filteredData);
    };

0 个答案:

没有答案