Method can not read state

I am using react-native and parse server. I'm implementing user registration, but this error appears:

undefined is not object (evaluating 'this.state.username')

Should not the state be read across the class?

import React, {Component} from 'react';
import {Container, Content, Form, Item, Input, Button, Text} from 'native-base';
var Parse = require('parse/react-native');

export default class Singup extends Component {
  constructor(props) {
    super(props);
    this.state = {
      username: '',
      password: ''
    };
  }

  Buttonpress() {
    Parse.initialize("APPLICATION_ID");
    Parse.serverURL = 'http://***.***.**.**:1337/parse'

    var user = new Parse.User();
    user.set("username", this.state.username);
    user.set("password", this.state.password);

    user.signUp(null, {
      success: function(user) {
        console.warn("YES");
      },
      error: function(user, error) {
        // Show the error message somewhere and let the user try again.
        alert("Error: " + error.code + " " + error.message);
      }
    });
  }

  render() {
    return (
      <Container>
        <Content>
          <Form>
            <Item>
              <Input
                placeholder="Username"
                onChangeText={(text) => this.setState({username: text})}
                value = {this.state.username}/>
            </Item>
            <Item last>
              <Input
                placeholder="Password"
                onChangeText={(text) => this.setState({password: text})}
                value = {this.state.password}/>
            </Item>
          </Form>
          <Button
            block
            onPress={this.Buttonpress}>
            <Text>Inscrever-se</Text>
          </Button>
        </Content>
      </Container>
    );
  }
}

Translated automatically.

Upvotes: 2

Views: 1657

Answers (1)

Andrii Starusiev
Andrii Starusiev

Reputation: 7774

Binding of your function should help you

  constructor(props) {
    super(props);
    this.state = {
      username: '',
      password: ''
    };
    this.Buttonpress = this.Buttonpress.bind(this);
  }

Here is the reference: https://facebook.github.io/react/docs/react-without-es6.html#autobinding

Upvotes: 4

Related Questions