React+Redux: State undefined

Question

I am playing around with React and Redux and ran into some issues with connect.

const AppConnected = connect((state) => {text: state.text})(App);

In the first example, I get the error message Cannot get 'text' of undefined whereas the second example runs without problems. What is the reason behind this?

const AppConnected = connect((state) => {
    return {
        text: state.text
    }
})(App);

Jamie Dixon · Accepted Answer · 2016-08-01 08:45:38Z

2

You're not returning an object in the first example like you think you are. You're defining the body of a function with a label called text.

To return an object literal from an arrow you need to wrap it in ().

(state) => ({})

Labels in JavaScript are used to control the flow of execution. It's not a recommended pattern but works like this:

function () {
text: while(someCondition){ // Label
  if (someOtherCondition) {
    continue text;
  }
} 
}

edited Aug 1, 2016 at 8:45

answered Aug 1, 2016 at 8:38

Jamie Dixon

54.1k21 gold badges131 silver badges168 bronze badges

Sign up to request clarification or add additional context in comments.

Comments

Serhii Baraniuk · Accepted Answer · 2016-08-01 08:39:36Z

2

DOCS:

Parenthesize the body to return an object literal expression:

const AppConnected = connect(state => ({text: state.text}))(App);

answered Aug 1, 2016 at 8:39

Serhii Baraniuk

3,3752 gold badges17 silver badges20 bronze badges

Collectives™ on Stack Overflow

React+Redux: State undefined

2 Answers 2

Comments

Comments

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

2 Answers 2

Comments

Comments

Your Answer

Sign up or log in

Post as a guest

Related