Reactjs 使用useState创建的反应状态不';当我的API更改时,我不会自动更新
我在使用react-useState状态时遇到了一个问题,问题是我希望状态在每次api更改其值时都会更新,但状态只是在加载组件时更改,下面是我遇到问题的部分的代码:Reactjs 使用useState创建的反应状态不';当我的API更改时,我不会自动更新,reactjs,api,jsx,Reactjs,Api,Jsx,我在使用react-useState状态时遇到了一个问题,问题是我希望状态在每次api更改其值时都会更新,但状态只是在加载组件时更改,下面是我遇到问题的部分的代码: const [partida,setPartida] = useState(); const getNumero = ()=>{ axios.get(`https://carta-rusa.herokuapp.com/routes/find/${localStorage.getItem('pa
const [partida,setPartida] = useState();
const getNumero = ()=>{
axios.get(`https://carta-rusa.herokuapp.com/routes/find/${localStorage.getItem('partidaId')}`)
.then(res=>{
setPartida(res.data.partida.jugadores.length)
})
.catch(err=>console.log(err));
}
useEffect(()=>{getNumero();},[])
如果位于
/routes/find/
的端点在不同的时间返回不同的数据,则有两个主要选项:
- 最容易实现,但不是很优雅:轮询。定期向该端点发出请求,比如每5分钟或每30秒或其他时间
- 更优雅的解决方案:让服务器发送更新的值。当组件装载时,建立与服务器的连接,并让服务器在发生更改时发送新数据。在客户端上,侦听套接字消息,当看到消息时,根据需要更新状态
useEffect(() => {
const get = () => {
axios.get(`https://carta-rusa.herokuapp.com/routes/find/${localStorage.getItem('partidaId')}`)
.then(res => {
setPartida(res.data.partida.jugadores.length)
})
.catch(err => console.log(err));
};
get();
const intervalId = setInterval(get, 30000);
return () => clearInterval(intervalId);
}, []);