发出 axios get 请求时出现无限循环

2024-07-03

当我使用 Axios 向 api 发出 get 请求时,我在 useEffect 挂钩中遇到无限循环,并且我确信添加第二个选项“[]”会告诉它只运行一次。有什么我遗漏或忽视的吗? console.log 向我显示它正在无限循环。

import React, {useEffect, useState} from 'react';
import axios from 'axios';
import { getCookie } from '../utils/util';




const Details = () => {

    const [data, setData] = useState(null);
    let country;    
    const queryURL = `https://restcountries.eu/rest/v2/name/`;

    useEffect(() => {
        country = getCookie('title');
        console.log(country);
        axios.get(queryURL + country).then((res) => {
            setData(res.data);
        }, []);

    })

    return (
        <>
            details
        </>
    )
}

export default Details;

您需要在后面放置空数组(依赖项)callback功能:

改成:

useEffect(() => {
  country = getCookie("title");
  console.log(country);
  axios.get(queryURL + country).then((res) => {
    setData(res.data);
  });
}, []);
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

发出 axios get 请求时出现无限循环 的相关文章

  • Jquery 密码字段的默认值

    我在用这个 Jquery 插件 http mudge github com jquery example 用于使用单击时消失的文本填充输入 它对于密码字段来说并不理想 因为所有内容都显示为点 在开始输入之前使默认文本在密码字段中可见的好方法
  • 在 C# 中使用匿名类型创建对象文字时出现问题

    我正在尝试构建 JavaScript 对象文字的 C 近似值 以传递给 asp net MVC 中的视图模型 var obj new dynamic new name Id index Id width 40 align left new
  • 浏览器在使用 CSS 缩放图像时通常使用什么算法?

    我想得到canvas以与 CSS 相同的视觉保真度渲染缩放图像 根据我的测试 在 Chrome 版本 43 0 2357 130 中完成 它似乎不是 Lanczos3 即使我的测试重采样范围 http entropymine com res
  • CdnFallbackExpression 列表

    CDN 上有很多可用的开源 JS 库 使用 ASP NET MVC 的捆绑功能 可以定义 CDN 失败时的后备方案 CdnFallbackExpression 是一个有用的功能 但是 我似乎找不到用于 jquery 之外的库的任何表达式列表
  • JavaScript 阻止表单提交

    当我按下 JavaScript 对话框上的取消按钮时 我试图让我的表单不提交 我有这个代码 document ready function submit click function e e preventDefault var link
  • GWT - 找不到入口点类

    我最近开始开发另一个 GWT 模块 因此 我创建了一个包 其中包含所有新类和一个实现新入口点的特定类 我将 gwt xml 修改为新的入口点 当我编译时 出现以下错误 GWT Compiling client side code WARNI
  • 用随机图像填充表格

    首先 我的编码经验包括修改简单的脚本以在我的页面上工作 其次 我搜索并发现了几个类似的问题 但无法完全解决它们 我需要一些帮助来使用大约 40 张图像数组中的随机图像填充 3x3 表 我目前有一个使用 backgroundImage 属性的
  • 如何将angularjs变量值分配给html元素属性,例如输入elememnt的name属性

    我对 Angular 完全陌生 我有一个 AngularJS scope 变量 scope testme inputname 我想将此变量值分配给 html 元素的 name 属性 我想 结果如下
  • Castle Windsor Fluent 注册 - Pick() 的作用是什么?

    当使用温莎城堡自动注册时 我看到人们在做类似的事情 container Register AllTypes Pick FromAssembly Assembly GetExecutingAssembly WithService FirstI
  • 使用来自外部 JS 文件的 Google Analytics 异步代码

    我正在尝试将 Google Analytics 跟踪代码的异步版本添加到网站 我想将 JavaScript 保存在一个单独的文件中 并从那里调用它 这是我的 js 文件中当前的内容 function addLoadEvent func va
  • 预加载队列中的 mp3 文件,以避免播放队列中下一个文件时出现任何延迟

    我正在编写一个脚本 其中我正在播放多个 mp3 并且每个文件都在队列中 播放下一个 mp3 文件会出现轻微延迟 因为缓冲 加载文件需要时间 我如何缓冲队列中的下一个 mp3 文件 以便所有文件顺利运行而没有任何延迟 getData 1 fu
  • 如何安装并开始使用 Vuetify 和 Vue.js 3

    我在哪里可以找到新的 Vuetify 版本与 Vue js 3 兼容的文档以及如何使用 Vue cli 安装和设置它 在 vue 2 中我们这样做 vue create project name then vue add vuetify 我
  • 如何将node.js应用程序转换为cordova

    我们建造了一个node js适用于台式机和平板电脑的应用程序 它是完全基于网络的应用程序 现在我计划在中实现与本机应用程序相同的应用程序android using Apache cordova 在项目目录下 我们有node modules
  • 获取此 contenteditable 元素中的当前行和行索引?

    我有一个这样的元素 span line 1 line 2 line 3 line 4 line 5 span 假设用户正在编辑 第 4 行 如何获取该 contenteditable 元素中的当前行和行索引 在插入符号位置 这是使用选择属性
  • 使用 RaphaelJS 确定图像何时加载到 svg 中

    我正在尝试弄清楚如何确定 svg 图像何时加载到浏览器中 我正在使用 Raphael JS 并且我已经尝试过 var image paper image path 0 0 10 10 image node addEventListener
  • Twitter 引导工具提示说明不起作用?

    我注意到我的 Twitter 引导工具提示不尊重data position 所以 我前往Twitter Bootstrap 工具提示演示 http twitter github com bootstrap javascript html t
  • 不固定高度的滚动div

    我需要构建一个动态调整大小的滚动 div div 应动态调整大小以适应屏幕 但如果内容不适合屏幕 它应该显示一个滚动条 因此浏览器自己的滚动条永远不需要激活 我可以通过在 div 中放置另一个 div 并使用来让滚动条出现在 div 中ov
  • IOS - React Native - 未处理的 JS 异常:SyntaxError

    每当我创建新的 React Native 项目时 我都会遇到问题 显示红色屏幕 并在 xcode 控制台中收到以下错误消息 嗨 我有同样的问题 在这里找到了解决方案 https github com facebook react nativ
  • 街景中标记上的 InfoWindows

    根据 Google 文档 当您在地图上创建标记时 市场也会 复制 到地图的街景版本上 但是 onClick 事件绑定不会被复制 或者至少看起来不会被复制 因此我无法在 StreetView 中打开标记上的 InfoWindow 理想情况下
  • JavaScript 开发人员不使用 Array.push() 是否有原因?

    我经常看到开发人员在 JavaScript 中使用如下所示的表达式 arr arr arr length Something arr arr length Another thing 不会push更合适吗 arr arr push Some

随机推荐

  • Android 圆形按钮可点击区域

    我在 Android Studio 中制作了这个圆形按钮 我使用了自定义背景 问题是图像中突出显示的黄色区域是可单击的 我想将可点击区域减少到仅红色圆圈 有什么办法可以做到这样的事情吗 You cannot删除图像的透明区域 因为它是你形象
  • WordPress 网站前端的 CSV 上传(PHP/SQL)

    我在某些领域取得了很大进展 但在其他领域却遇到了困难 目标是 客户正在使用现有的 WordPress 网站 他们希望管理员用户访问带有上传选项的前端页面之一 他们可以在其中上传 CSV 每天几次 然后 在访问门户中的其他页面时 将显示表格中
  • WordPress 网站前端的 CSV 上传(PHP/SQL)

    我在某些领域取得了很大进展 但在其他领域却遇到了困难 目标是 客户正在使用现有的 WordPress 网站 他们希望管理员用户访问带有上传选项的前端页面之一 他们可以在其中上传 CSV 每天几次 然后 在访问门户中的其他页面时 将显示表格中
  • 如何增加 IntelliJ IDEA 上的内存堆大小?

    我想分配大约 1GB 的堆大小 但我似乎无法弄清楚 这个怎么做 Use Help 编辑自定义虚拟机选项 右侧会自动打开一个编辑器 vmoptions文件 调整值 Xmx 保存并重启IntelliJ IDEA 查看 IntelliJ IDEA
  • 如何增加 IntelliJ IDEA 上的内存堆大小?

    我想分配大约 1GB 的堆大小 但我似乎无法弄清楚 这个怎么做 Use Help 编辑自定义虚拟机选项 右侧会自动打开一个编辑器 vmoptions文件 调整值 Xmx 保存并重启IntelliJ IDEA 查看 IntelliJ IDEA
  • 为简单的 hadoop mapreduce 作业运行两个映射器和两个减速器

    我只是想更好地了解如何使用多个映射器和化简器 我想使用一个简单的 hadoop mapreduce 字数统计作业来尝试一下 我想为这个字数统计作业运行两个映射器和两个化简器 我是否需要这样做在配置文件上手动配置 或者仅对 WordCount
  • 为简单的 hadoop mapreduce 作业运行两个映射器和两个减速器

    我只是想更好地了解如何使用多个映射器和化简器 我想使用一个简单的 hadoop mapreduce 字数统计作业来尝试一下 我想为这个字数统计作业运行两个映射器和两个化简器 我是否需要这样做在配置文件上手动配置 或者仅对 WordCount
  • React Native 应用程序 - 在 Android 8 真实设备上启动时崩溃/关闭

    我有一个 React Native 项目 不是 Expo 初始化为react native init myapp 我可以在装有 Android 5 的模拟器和真实设备上运行此应用程序 但无法在装有 Android 8 的 Android 手
  • React Native 应用程序 - 在 Android 8 真实设备上启动时崩溃/关闭

    我有一个 React Native 项目 不是 Expo 初始化为react native init myapp 我可以在装有 Android 5 的模拟器和真实设备上运行此应用程序 但无法在装有 Android 8 的 Android 手
  • 是否可以导出为 CSV 并让标题包含空格?

    我需要将 SSRS 2005 报告导出为 CSV 其中列标题包含空格 目前 CSV 标题列标题源自 textBox 属性名称 并使用下划线而不是空格 还有其他更好的方法吗 例如 目前我有 SSRS 报告标题 生效日期 文本框名称 生效日期
  • 是否可以导出为 CSV 并让标题包含空格?

    我需要将 SSRS 2005 报告导出为 CSV 其中列标题包含空格 目前 CSV 标题列标题源自 textBox 属性名称 并使用下划线而不是空格 还有其他更好的方法吗 例如 目前我有 SSRS 报告标题 生效日期 文本框名称 生效日期
  • 小数可以表示的第二个最小值是多少?

    什么是第二个最小值值一个decimal可以代表吗 该值大于Decimal MinValue并且小于任何其他值decimal可以代表 在C 中如何获取这个值 谢谢 第二个最小值是Decimal MinValue 1 这可以从文档中推断出dec
  • 小数可以表示的第二个最小值是多少?

    什么是第二个最小值值一个decimal可以代表吗 该值大于Decimal MinValue并且小于任何其他值decimal可以代表 在C 中如何获取这个值 谢谢 第二个最小值是Decimal MinValue 1 这可以从文档中推断出dec
  • 让qmake默认使用qt5

    我的 Linux 系统上有 qt4 和 qt5 默认使用qt4 有什么干净的方法可以改变它 以便 qmake 默认使用 qmake qt5 系统可能有不同的元包来处理默认值 例如在 Debian 上有一个qt4 default and a
  • 让qmake默认使用qt5

    我的 Linux 系统上有 qt4 和 qt5 默认使用qt4 有什么干净的方法可以改变它 以便 qmake 默认使用 qmake qt5 系统可能有不同的元包来处理默认值 例如在 Debian 上有一个qt4 default and a
  • 在 ember.js 中定义多分段 catch all 路由

    我正在使用 Ember js 我想创建一个捕获所有路由 以便在用户导航到与资源不匹配的 URL 时将其发送回应用程序的根目录 我正在使用历史API 我已经这样实现了 App Router map function this resource
  • 在 ember.js 中定义多分段 catch all 路由

    我正在使用 Ember js 我想创建一个捕获所有路由 以便在用户导航到与资源不匹配的 URL 时将其发送回应用程序的根目录 我正在使用历史API 我已经这样实现了 App Router map function this resource
  • 用于强制 .NET 应用程序以 32 位运行的环境变量

    有人告诉我 您可以设置一个环境变量来强制 NET 应用程序在 x64 版本的 Windows 上作为 32 位应用程序运行 你知道它是什么 或者知道它的参考资料吗 恐怕我的 google fu 今天让我失望了 或者它不存在 我正在使用 Re
  • 用于强制 .NET 应用程序以 32 位运行的环境变量

    有人告诉我 您可以设置一个环境变量来强制 NET 应用程序在 x64 版本的 Windows 上作为 32 位应用程序运行 你知道它是什么 或者知道它的参考资料吗 恐怕我的 google fu 今天让我失望了 或者它不存在 我正在使用 Re
  • 发出 axios get 请求时出现无限循环

    当我使用 Axios 向 api 发出 get 请求时 我在 useEffect 挂钩中遇到无限循环 并且我确信添加第二个选项 会告诉它只运行一次 有什么我遗漏或忽视的吗 console log 向我显示它正在无限循环 import Rea