Having trouble accessing React actions in isomorphic application

问题

Iam using Alt.js with React and getting error in HomeActions.js file HomeActions.js: Uncaught TypeError: Cannot read property 'updateUserSuccess' of undefined. Not to mention the same code was working flawlessly before i completely reinstalled node_modules.

here is the code

import alt from '../../alt';
import request from 'superagent';

class HomeActions {
    constructor() {
        this.generateActions(
            'updateUserSuccess',            
        );
    }

    getUser() {
        request
            .get('api/getuser')
            .end((err, res) => {
                this.actions.updateUserSuccess(res.text);
            });
    }                       
}

export default alt.createActions(HomeActions);

getUser() is called in the componenetdidmount(){} function of Home.js

Also directly calling the action property from the component does work so i guess the problem is not with Alt.js or generateActions : eg

import alt from '../../alt';

class NavbarActions {
  constructor() {
    this.generateActions(
      'updateOnlineUsers'
    );
  }

}

export default alt.createActions(NavbarActions);

//in Navbar.js
componentDidMount() {
    NavbarStore.listen(this.onChange);
    NavbarActions.updateOnlineUsers(somedata);
  }

//this is working**

This question might be related to my last question about calling a function inside an instance method.

Sidenote : After updating the dependencies I also had to make changes to use RouterContext istead of RoutingContext in the server-side react-middle-ware, and to solve an issue related to that I imported browserHistory from react-router (before i was using createBroswerHistory from 'history/createBrowserHistory')

Edit 1 : I replaced this.actions.updateUserSuccess(res.text); with alt.actions.HomeActions.updateUserSuccess(res.text); and the updateUserSuccess is accessible but still getting a warning ReferenceError: An action was called but nothing was dispatched

Edit 2 : I just got to the core of the issue by using console.log(this); in the newer version and also in the older version here are the logs

Older version :

AltAction {id: "HomeActions.getTwoCharacters", actions: Object, actionDetails: Object, alt: Alt, dispatched: false}
_dispatch : ()
actionDetails :
Object actions :
Object alt :
Alt dispatched :
false id :
"HomeActions.getTwoCharacters"
__proto__ : Object

New Version

Object {GET_USER: "HomeActions.getUser", LOGOUT: "HomeActions.logout", UPDATE_USER_SUCCESS: "HomeActions.updateUserSuccess", UPDATE_USER_FAIL: "HomeActions.updateUserFail", LOGOUT_SUCCESS: "HomeActions.logoutSuccess"…}
GET_USER : "HomeActions.getUser"
LOGOUT : "HomeActions.logout"
LOGOUT_FAIL : "HomeActions.logoutFail"
LOGOUT_SUCCESS : "HomeActions.logoutSuccess"
UPDATE_USER_FAIL : "HomeActions.updateUserFail"
UPDATE_USER_SUCCESS : "HomeActions.updateUserSuccess"
getUser  :  action()
logout :  action()
logoutFail : action()
logoutSuccess : action()
updateUserFail : action()
updateUserSuccess : action()
__proto__ :  Object

Clearly there is no dispatching method in the newer version. Can somebody explain why is this so?

来源：https://stackoverflow.com/questions/39952422/having-trouble-accessing-react-actions-in-isomorphic-application

标签

javascript

reactjs

isomorphic-javascript

alt.js