Warning: file_get_contents(/data/phpspider/zhask/data//catemap/3/reactjs/23.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript 基于redux状态有条件地在组件中调用函数的方式和位置_Javascript_Reactjs_Redux - Fatal编程技术网

Javascript 基于redux状态有条件地在组件中调用函数的方式和位置

Javascript 基于redux状态有条件地在组件中调用函数的方式和位置,javascript,reactjs,redux,Javascript,Reactjs,Redux,我有一个组件,在我的组件中有一些子组件 在父组件中,我有一些函数,我想从子组件触发它。所以我用redux做了 这是我的父组件: import React, { Component } from "react"; import { withRouter } from "react-router-dom"; import { bindActionCreators } from "redux"; import { splashStop } from "store/acti

我有一个组件,在我的组件中有一些子组件

在父组件中,我有一些函数,我想从子组件触发它。所以我用redux做了

这是我的父组件:

   import React, { Component } from "react";
    import { withRouter } from "react-router-dom";
    import { bindActionCreators } from "redux";
    import { splashStop } from "store/actions/Home/splashStop";

import { connect } from "react-redux";

class Home extends Component {
  constructor(props) {
    super(props);
    this.state = {
    };
    this.goPage = this.goPage.bind(this);
  }

  componentDidMount() {
  }

  goPage = () => {
     this.props.history.push("/agencies");
  };

  render() {
    if (this.props.homeSplash.splashStart == true) {
      myTime.play();
    }
    return (
      <div>
         <ChildComponent />
      </div>
    );
  }
}

const mapStateToProps = state => ({
  homeSplash: state.homeSplash
});

function mapDispatchToProps(dispatch) {
  return {
    splashStop: bindActionCreators(splashStop, dispatch)
  };
}

export default connect(
  mapStateToProps,
  mapDispatchToProps
)(withRouter(Home));
我的行动:

导出常量启动\u飞溅= “启动水花”

还有我的减速机:

import { START_SPLASH } from "store/actions/Home/splashStart";

let initialState = {
  splashStart: false
};

export default (state = initialState, action) => {
  switch (action.type) {
    case START_SPLASH:
      return { ...state, splashStart: action.payload };
    default:
      return state;
  }
};
我的减速器,动作正常

我想知道为什么
myTime.play()组件安装时始终工作只是不关心此控件:

if (this.props.homeSplash.splashStart == true) {
          myTime.play();
        }

我把它放错地方了还是怎么了

在您的redux结构中,似乎一切正常。但您也应该提供您的childComponent,以使其更加清晰。
如果已在子组件中正确连接redux操作,请尝试以下操作:

this.triggerssplash()}>单击

将箭头函数放入单击后的
onClick
。因为,在组件初始化中,所有组件函数都会在渲染时自动调用。

在redux结构中,似乎一切正常。但您也应该提供您的childComponent,以使其更加清晰。
如果已在子组件中正确连接redux操作,请尝试以下操作:

this.triggerssplash()}>单击

将箭头函数放入单击后的
onClick
。因为,在组件初始化中,所有组件函数都会在渲染时自动调用。

能否显示如何附加triggerSplash事件。能否显示如何附加triggerSplash事件。
import { START_SPLASH } from "store/actions/Home/splashStart";

let initialState = {
  splashStart: false
};

export default (state = initialState, action) => {
  switch (action.type) {
    case START_SPLASH:
      return { ...state, splashStart: action.payload };
    default:
      return state;
  }
};
if (this.props.homeSplash.splashStart == true) {
          myTime.play();
        }