Question

我是新手，对原生和一般的编程做出反应。我在这里需要帮助。

我有一个简单的登录屏幕，用户输入电子邮件和密码。当用户点击登录按钮时，我会调用我的Web服务来检查我的数据库中该电子邮件/密码组合的匹配记录数。 Web服务以JSON格式返回计数。但是我的数量空白了。我怀疑这与设置状态有关。

来自网络服务的JSON： { “订户”：[{ “计数”： “0”}]}

这是我的代码：

console.log("data", this.state.data);
console.log("uCount", this.state.uCount);

在按钮上单击我调用_onPressButton函数，该函数调用getData函数来调用Web服务并从JSON获取计数。我已经验证了url构造是正确的，它返回正确的JSON。当我打印

data []
uCount

调用getData函数后，数据数组为null，count为空白初始化

.then((responseJson) => {
     this.setState({
      data: responseJson.Subscriber,
      uCount: responseJson.Subscriber[0].count
    })

这意味着下面的代码无效。

{{1}}

请帮忙。

Answer 1

我有一个解决方案，也许可以帮助你，首先改变你的获取数据，使用返回承诺，所以我们必须在console.log

之前等待这个功能。

getData(){
  return new Promise ((resolve, reject) => {
    var url="myurl.php?email=" + this.state.email + "&password=" + this.state.password;
    console.log("URL:", url);
    return fetch(url)
    .then((response) => response.json())
    .then((responseJson) => {
      this.setState({
        data: responseJson.Subscriber,
        uCount: responseJson.Subscriber[0].count
      })
      resolve(responseJson);
    })
    .catch((error) => {
      reject(error);
    });
 })
}

然后您可以将_onPressButton()更改为此<：p>

_onPressButton() {

    this.getData()
    .then((response) => {
        console.log("email:", this.state.email);
        console.log("passwd:", this.state.password);

        console.log("data", this.state.data);
        console.log("uCount", this.state.uCount);

        if (this.state.uCount < 1) {
            Alert.alert('Fail')
        } else {
            this.props.navigation.navigate('LoginSuccess', { email: this.state.email, password: this.state.password})      
      }
    }).catch((error) => {
      console.log(error);
    });
}

希望它可以帮助你，谢谢：）

反应原生JSON和State

1 个答案: