箭头函数中使用的React-Native错误setState

时间:2017-07-10 16:38:04

标签: react-native

我知道有一千个这样的问题涉及同一个问题,但我已经用尽了想法可能会导致我的问题:/

我在获得API回复后尝试更新变量 我已经更改了所有函数以使用箭头功能,但我不断收到此错误:
binary
我无法在代码中找到错误。

任何人都可以看到错误吗?

应用程序/路由/用户/登录/ view.js

this.setState is not a function

应用程序/路由/用户/登录/ index.js

const UsersLoginView = (props) => {
  let email = '';

  this.state = {
    textError: '',
    inputError: false,
  }

  login = (event) => {
    device_info = {
      UUID: DeviceInfo.getUniqueID(),
      brand: DeviceInfo.getBrand(),
      model: DeviceInfo.getModel(),
      system: DeviceInfo.getSystemName(),
      system_version: DeviceInfo.getSystemVersion(),
      timezone: DeviceInfo.getTimezone(),
      locale: DeviceInfo.getDeviceLocale(),
    }

    fetch("my url", {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({
        email: email,
        device: device_info
      })
    })
    .then((response) => response.json())
    .then((responseJson) => {
      this.setState({
        textError: 'SUCCESS',
        inputError: false
      });
    })
    .catch(error => {
      this.setState({
        textError: error.message,
        inputError: true
      });
    })
    .done();
  },

  updateEmail = (text) => {
    email = text
  }

  return (
    <Container>
      <Content>
        <Text style={{fontWeight: 'bold'}}>
          User
        </Text>
        <Form>
          <Item error={this.state.inputError}>
            <Icon active name='ios-at-outline' />
            <Input
              autoCorrect={false}
              placeholder='E-mail'
              returnKeyType='go'
              keyboardType='email-address'
              autoCapitalize='none'
              onChangeText = { (text) => updateEmail(text) }
            />
          </Item>
          <Text>{this.state.textError}</Text>
              <Button full light style={{marginTop: 20}} onPress={ () => login }>
            <Text>Login</Text>
          </Button>
        </Form>
      </Content>
    </Container>
  );
};

export default UsersLoginView;

也许登录功能应该在index.js文件中然后我才能访问状态?

1 个答案:

答案 0 :(得分:0)

错误在于:const UsersLoginView = (props) => {,如果要维护状态,则需要使用类。