Masoud Tavakkoli
Masoud Tavakkoli

Reputation: 1020

Cannot read property [PROPERTY] of undefined in this.state in React native

I am new in React-native and I learn from Udemy videos. I follow videos but because of react-native version differences things changed. I have an error this.state that is undefined.

Cannot read property 'newTodoText' of undefined

I use react-redux

this is my Main.js code

constructor(props) {
        super(props);
        this.state = {
            newTodoText: ""
        };
    }

addNewTodo(){
    console.log(this.state);  // undefined <------------ 
    var newTodoText = this.state.newTodoText;
    {/* var {newTodoText} = this.state; */}
    if (newTodoText && newTodoText != "") {
        this.setState({
            newTodoText: ""
        })
        this.props.dispatch(addTodo(newTodoText));
    }
}

and this is my render()

<TextInput  
      onChangeText={(text) => this.setState({newTodoText:text})}
      value={this.state.newTodoText}
      returnKeyType="done"
      placeholder="New ToDo"
      onSubmitEditing={this.addNewTodo}
      underlineColorAndroid="transparent"
      style={styles.input}
>

</TextInput>

Upvotes: 1

Views: 7724

Answers (2)

captain_kirk
captain_kirk

Reputation: 11

You could also use Arrow Function if you have babel dependency transform-class-properties or enable stage-2 preset.

addNewTodo = () => {
 code.....
}

Upvotes: 1

David
David

Reputation: 16287

constructor(props) {
    super(props);
    this.addNewTodo = this.addNewTodo.bind(this); // Here is the key
    ...
}

Upvotes: 4

Related Questions