Warning: file_get_contents(/data/phpspider/zhask/data//catemap/6/apache/9.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 分派非常简单的重复操作_Javascript_Reactjs_Redux - Fatal编程技术网

Javascript 分派非常简单的重复操作

Javascript 分派非常简单的重复操作,javascript,reactjs,redux,Javascript,Reactjs,Redux,下午好 我有一个非常艰难的一天,试图让这个非常简单的redux操作正常工作。我想做的就是将我的状态更改为当前正在查看的选项卡-就是这样!没什么特别的。我将向您展示组件、动作创建者和减速器: StudentDash.js: import React from "react"; import {connect} from "react-redux"; import { chooseTab } from "../../actions/dashActions"; const StudentDash

下午好

我有一个非常艰难的一天,试图让这个非常简单的redux操作正常工作。我想做的就是将我的状态更改为当前正在查看的选项卡-就是这样!没什么特别的。我将向您展示组件、动作创建者和减速器:

StudentDash.js

import React from "react";
import {connect} from "react-redux";

import { chooseTab } from "../../actions/dashActions";

const StudentDash = React.createClass({

  handleTabChange(button){
    chooseTab(button);
  },

  render(){
    return(

        <div className="dashContainer">
          <div className="nav">
            <div id="userInfo">
              Hello {this.props.user.username}
            </div>
            <div id="navButtons">
              <button  onClick={() => this.handleTabChange("profile")}>Profile</button>
              <button  onClick={() => this.handleTabChange("caleander")}>Caleander</button>
              <button  onClick={() => this.handleTabChange("ballots")}>Ballot Entry</button>
            </div>
          </div>
          <div className="navFocus"></div>
        </div>

      )
  }

});

const mapStateToProps = (state) => {
  return{
    user: state.user,
    activeTab: state.activeTab
  }
};
const mapDispatchToProps =  {
  chooseTab
};

export default connect(mapStateToProps, mapDispatchToProps)(StudentDash);
export function chooseTab(tab){

  console.log(tab.toUpperCase());

  return {
    type: tab.toUpperCase()
  }
}
dashReducer.js

export function activeTab(state={}, action){


      switch(action.type){

          case "PROFILE":
            console.log("profile");
            return state;

          case "CALEANDER":
            console.log("CALEANDER");
            return state;
          case "BALLOTS":
            console.log("BALLOTS");
            return state;
          default:
            return state;
      }

  };

我已经试着将
类型
编码到
action.type
监听器之一,例如“选票”。在此之前,我已经使用redux成功地实现了异步操作。我要疯了,试图让这个非常简单的标签选择动作正常工作,需要一个新的眼睛-因为我不知道为什么我的减速机没有拿起这个

我假设您当前在控制台中有一个错误,它说
chooseTab不是一个函数


当您
将组件连接到redux并使用函数
mapDispatchToProps
时,您将返回的函数作为道具提供给组件。这意味着,当您想要分派该操作时,您需要向其发出la
This.props.chooseTab(按钮)

你们在哪里注册减速器?对我来说,看起来你注册和发送都很正常。他们注册在一个联合减速器中@yowakita帮了我一把。是的,就是这样。我没有错误来提示我,但是
这个.props.chooseTab(tab)
就是这样做的。谢谢你结束了我生命中疯狂的一小时。没问题,很高兴我能帮上忙@m00saca
chooseTab
已定义,但
connect
也充当
存储调度
(在
redux
中)和动作创建者之间的绑定。你打电话给你的动作创建者,但它什么也没做,只是返回动作。没有
connect
的等价物是
store.dispatch(chooseTab(tab))