Reactjs 反应useEffect内存泄漏,第二个参数
我正在useEffect中获取数据,打算用获取的数据更新useState。我一直在oneCrypto状态值内获取null,即使控制台日志显示数据已收到。意识到这与useState中缺少第二个参数有关。添加[]空数组时,我的oneCrypto显示null。当我在阵列中设置[oneCrypto]作为依赖项时,我的应用程序崩溃了-请求太多,控制台日志会反复打印接收到的数据,我不明白为什么。。。请帮忙Reactjs 反应useEffect内存泄漏,第二个参数,reactjs,use-effect,Reactjs,Use Effect,我正在useEffect中获取数据,打算用获取的数据更新useState。我一直在oneCrypto状态值内获取null,即使控制台日志显示数据已收到。意识到这与useState中缺少第二个参数有关。添加[]空数组时,我的oneCrypto显示null。当我在阵列中设置[oneCrypto]作为依赖项时,我的应用程序崩溃了-请求太多,控制台日志会反复打印接收到的数据,我不明白为什么。。。请帮忙 import React, { useState, useEffect } from "r
import React, { useState, useEffect } from "react"
import { useParams } from "react-router-dom"
export default function SingleCrypto() {
const [loading, setLoading] = useState(false)
const [oneCrypto, setOneCrypto] = useState(null)
const { id } = useParams()
useEffect(() => {
async function getOneCrypto() {
try {
const proxyurl = "https://cors-anywhere.herokuapp.com/";
const response = await fetch(proxyurl +
"https://pro-api.coinmarketcap.com/v1/cryptocurrency/info?id=" +
id,
{
headers: {
}
}
)
const data = await response.json()
const mydata = data.data;
setOneCrypto(mydata)
console.log(oneCrypto)
} catch (error) {
console.log(error)
}
}
getOneCrypto()
}, [oneCrypto])
return <>
<h1>I am Single Crypto page</h1>
</>
}
从“React”导入React,{useState,useEffect}
从“react router dom”导入{useParams}
导出默认函数SingleCrypto(){
常量[loading,setLoading]=useState(false)
常量[oneCrypto,setOneCrypto]=useState(null)
const{id}=useParams()
useffect(()=>{
异步函数getOneCrypto(){
试一试{
常量proxyurl=”https://cors-anywhere.herokuapp.com/";
const response=wait fetch(代理URL+
"https://pro-api.coinmarketcap.com/v1/cryptocurrency/info?id=" +
身份证件
{
标题:{
}
}
)
const data=wait response.json()
const mydata=data.data;
setOneCrypto(mydata)
console.log(oneCrypto)
}捕获(错误){
console.log(错误)
}
}
getOneCrypto()
},[oneCrypto])
返回
我是单加密页
}
调用setOneCrypto
会导致重新渲染,并且由于oneCrypto在上次渲染后发生了更改,因此再次调用useffect
,并重新启动进程。在useffect
中,调用console.log(oneCrypto)
的操作发生在值更新之前,因为更新发生在渲染之间
尝试从第二个参数中传递的数组中删除oneCrypto,并在useEffect之外调用console.log。您的循环是:
1) |--> your async function call setOneCrypto ---|
2) |-- new value of oneCrypto call useEffect <--|
为什么要在
useffect()
中返回函数?
!oneCrypto && getOneCrypto();