![](/img/trans.png)
[英]React Hooks useCallback and useEffect causes infinite loop in react application
[英]react js hooks useEffect infinite loop
我在玩React挂钩,并在https://www.valentinog.com/blog/hooks/跟随tutorail。 我将空数组作为文档之后的第二个参数,并且由于某些原因我仍然遇到无限循环。
import React, { useState, useEffect } from "react";
export default function useDataLoader() {
const [data, setData] = useState([]);
useEffect(() => {
fetch("http://api.icndb.com/jokes/random")
.then(response => response.json())
.then(data => {
setData(data.value.joke)
console.log(data)
}, []);
});
return (
<div>
<div>
{data}
</div>
</div>
);
}
import React, { Component } from 'react';
import logo from './logo.svg';
import './App.css';
import Hook from './components/Hook'
import DataLoader from './components/DataLoader'
class App extends Component {
render() {
return (
<div className="App">
<Hook />
<DataLoader/>
</div>
);
}
}
export default App;
[]
放在错误的位置。 您将其传递给fetch().then()
而不是useEffect
useEffect(() => {
fetch("http://api.icndb.com/jokes/random")
.then(response => response.json())
.then(data => {
setData(data.value.joke)
console.log(data)
});
}, []);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.