React Native：如何在fetch方法中为全局变量赋值？（遇无输出问题）

我帮你梳理下代码里的问题，以及对应的修复方案：

代码里的核心问题 #

1. catch 位置错误：你把错误捕获的.catch()放在了map方法后面，这完全不符合Promise链式调用的规则——它应该紧跟在第二个.then()之后，否则根本捕获不到请求或JSON解析过程中的错误，还会打乱代码执行逻辑。
2. 异步执行顺序问题：你在fetch的异步回调外部打印global.UserID，但fetch是异步操作，这行代码会在请求还没返回、变量还没赋值的时候就执行，自然看不到预期输出。
3. 多余的数组操作：API返回的是单个用户对象，没必要把它push到arrFinal数组再用map遍历，直接从responseJson里取值就行，完全是画蛇添足。

修正后的代码 #

componentDidMount() {
  fetch('my API url')
    .then(response => response.json())
    .then(responseJson => {
      // 直接从返回的单个对象中提取user_Id赋值
      global.UserID = responseJson.user_Id;
      // 在这里打印，确保是请求完成后执行
      console.log(global.UserID);
    })
    .catch(error => {
      // 正确捕获请求/解析过程中的错误
      console.error('请求出错:', error);
    });
}

额外建议：尽量避免使用全局变量 #

虽然上面的代码能解决你的问题，但在React Native中用global全局变量并不是最佳实践，容易导致状态管理混乱（比如变量被意外覆盖、难以追踪状态变化）。更推荐的替代方案：

• React Context API：适合中小规模应用，专门用于跨组件共享状态
• Redux/Toolkit：适合大型、状态逻辑复杂的应用
• 若使用React Navigation，也可以通过导航参数传递，但仅适合页面间的短期数据传递

内容的提问来源于stack exchange，提问作者Sidath