React Native 未处理的承诺拒绝 | React-Native，异步，

Posted 2023-02-16

【中文标题】React Native 未处理的承诺拒绝 | React-Native，异步，

【英文标题】：React Native Unhandled promise rejection | React-Native, Async,

【发布时间】：2021-06-25 21:57:47

【问题描述】：

我不断收到未处理的 Promise Rejection 我正在使用 EXPO CLI 运行 React-Native，并且正在使用 React Hook Forms

我尝试过的事情并没有改变：

给我的 api (NodeJS) 一个 SSL（我知道 ios 想要一个） 重构为每个字段的常规和反应挂钩 将 BaseUrl 更改为 10.0.2.2，然后尝试了我的个人 IP 地址。 更改为正常的 Promise 并尝试 Axios 调用

onSubmit 函数内的控制台日志从表单返回数据，但它停在那里。

完整错误：

[未处理的承诺拒绝：TypeError: (0, _auth.loginUser) 不是函数。 （在“（0，_auth.loginUser）（数据）”中，“（0，_auth.loginUser）”未定义）] 在 node_modules/react-hook-form/dist/index.cjs.development.js:1204:67 中 在 [本机代码]：flushedQueue 中的 null at [native code]:null in callFunctionReturnFlushedQueue

登录组件代码：

import React from 'react';
import  StyleSheet, View, Text  from 'react-native';

import Input from '../Input';
import Button from '../Button';
import Link from '../Link';
import  useForm, Controller  from "react-hook-form";
import  loginUser  from '../../helpers/data/auth';

const EMAIL_REGEX = /^(([^<>()\[\]\\.,;:\s@"]+(\.[^<>()\[\]\\.,;:\s@"]+)*)|(".+"))@((\[[0-9]1,3\.[0-9]1,3\.[0-9]1,3\.[0-9]1,3\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]2,))$/;

export default function Login() 
  const  control, handleSubmit, errors  = useForm();

  const onSubmit = async (data) => 
    console.log(data)
    let response = await loginUser(data)
    if (response.status >= 200 && response.status < 300) 
      console.log(response)
     else 
      error
    
  

  return (
    <View style=styles.container>

      <Controller
        control=control
        name="email"
        defaultValue=''
        rules=
          required: value: true, message: 'Email is required' ,
          pattern: 
            value: EMAIL_REGEX,
            message: 'Not a valid email'
          
        
        render=( onChange, onBlur, value ) => (
        <Input
          error=errors.email
          errorText=errors?.email?.message
          onBlur=onBlur
          onChangeText=value => onChange(value)
          value=value
          placeholder='Email'
          textAlign='center'
        />
        )
      />

      <Controller
        control=control
        name="password"
        defaultValue=''
        rules= required: value: true, message: 'Password is required'  
        render=( onChange, onBlur, value ) => (
          <Input
            error=errors.password
            errorText=errors?.password?.message
            onBlur=onBlur
            onChangeText=value => onChange(value)
            value=value
            secureTextEntry=true
            placeholder='Password'
            textAlign='center'
          />
        )
      />
      <Button onPress=handleSubmit(onSubmit) label="LOGIN"/>

      <View style=styles.row>
        <Text style=styles.text>Forgot your login details? </Text>
        <Link onPress=() =>  label='Get help signing in.'/>
      </View>

    </View>
  )

loginUser Fetch 调用：

import  baseUrl  from '../apiKeys.json';

const loginUser = async (data) => 
  const response = await fetch(`$baseUrl/auth/signin`, 
    method: 'POST',
    headers: 
      Accept: 'application/json',
      'Content-Type': 'application/json'
    ,
    body: JSON.stringify(data)
  );
  return response.json();


export default  loginUser ;

救救我……

【问题讨论】：

UPDATE 添加方法后我得到：Network request failed at node_modules/whatwg-fetch/dist/fetch.umd.js:535:17 in setTimeout$argument_0 at [native code]:null in callFunctionReturnFlushedQueue 我收到的所有错误都有这个callFunctionReturnFlushedQueue。有谁知道这是做什么的？

【参考方案1】：

在const前面添加export

import  baseUrl  from '../apiKeys.json'; //not quite remember whether u can do this.

//add the export here.

export const loginUser = async (data) => 
  const response = await fetch(`$baseUrl/auth/signin`, 
    headers: 
      Accept: 'application/json',
      'Content-Type': 'application/json'
    ,
    body: JSON.stringify(data)
  );
  return response.json();

【讨论】：

我以前试过；既导出对象中的所有函数，又直接导出函数的开头，均无济于事。我也意识到我没有注释method: 'POST'，但现在我得到了一个：Network request failed at node_modules/whatwg-fetch/dist/fetch.umd.js:535:17 in setTimeout$argument_0 at [native code]:null in callFunctionReturnFlushedQueue

你的后端是什么？

NodeJs。我正在用邮递员连接它。

所以现在是 nodejs 问题，与您的问题无关吧？

我不相信，因为我可以通过邮递员甚至直接在浏览器中对api进行成功调用。