I am aware there are similar issues but none of them helped me to fix mine.

So here is my issue.

I am working with react native and using the flux dispatcher. Dispatch and register of my app dispatcher works fine. My issue is that when I want to change/set the state inside the dispatch register function I always get the error message that this.setState() is not a function. Of course I thought this must be a binding issue then (writing in es6), so I tried all sorts of binding "this" but I still can't get it work. Has anyone any idea why?

Here is that bit of code that doesn't work:

testDispatcher() {    
    AppDispatcher.register( (action) => {
        if ( action.action === TEST_ACTION ) {
            // I tried setting state inside here
            this.setState({
                view: action.view
            }).bind(this); // with or without this bind doesn't make a difference

            // I also tried having a function outside of this function where I set the state.. this doesn't work either.
            //this.updateView('home').bind(this);
            console.log('dispatch register');
        }
    });
}

I also tried to console log "this" inside my register function and "this" does return my app class.

I am aware there are similar issues but none of them helped me to fix mine.

So here is my issue.

I am working with react native and using the flux dispatcher. Dispatch and register of my app dispatcher works fine. My issue is that when I want to change/set the state inside the dispatch register function I always get the error message that this.setState() is not a function. Of course I thought this must be a binding issue then (writing in es6), so I tried all sorts of binding "this" but I still can't get it work. Has anyone any idea why?

Here is that bit of code that doesn't work:

testDispatcher() {    
    AppDispatcher.register( (action) => {
        if ( action.action === TEST_ACTION ) {
            // I tried setting state inside here
            this.setState({
                view: action.view
            }).bind(this); // with or without this bind doesn't make a difference

            // I also tried having a function outside of this function where I set the state.. this doesn't work either.
            //this.updateView('home').bind(this);
            console.log('dispatch register');
        }
    });
}

I also tried to console log "this" inside my register function and "this" does return my app class.

• javascript
• reactjs
• ecmascript-6
• flux

2 Answers 2

The => binds this to the scope of testDispatcher(). That's probably not what you want. In this case I think you should drop the => notation but simply a regular anonymous function.

Also, this.setState(...args...).bind(this) is totally wrong. 1) The this. part indicates that the .bind(this) is redundant. 2) The syntax for binding is like: foo.setState.bind(notFoo, ...args...).

My class didn't extend from React Component, therefore this.setState was not a function.