如何在 axios().then() 中使用 useContext hook 的调度函数?

Question

在我的组件中

axios({
method: 'get',
url: `${SERVER_URL}crawler/get-customer/${uniqueId}`,
}).then(function (response) {
if(response.data){
console.log("response",response);
responseData = response.data;
dispatch({ type: 'SET_IMG', payload: { url: responseData.logo_url } });
}
},[]);

响应如期而至，但调度是递归的，几乎使我的浏览器崩溃，并且数据"URL"未更新

Answer 1

useEffect(() => {
axios({
method: 'get',
url: `${SERVER_URL}crawler/get-customer/${uniqueId}`,
}).then(function (response) {
if(response.data){
console.log("response",response);
responseData = response.data;
props.functionName(response.data);
}
},[]);
const mapDispatchToProps = dispatch => {
return {
functionName: (data) => dispatch({
type:'SET_IMG',
payload: { url: responseData.logo_url }
})
}
}
export default connect(, mapDispatchToProps)(nameComponent);

Answer 2

如果您可以发布整个组件，那会有所帮助，但无论如何我都会试一试......

我假设您的组件也从状态(redux？(中获取获取的数据值，然后很可能正在发生这种类型的循环：

• 组件渲染
• 获取数据
• 更新状态中的值(reux？
• 组件呈现，因为值已更新
• 获取数据
• 更新状态中的值
• 等

您是否打算只获取一次数据？如果你做这样的事情：

useEffect(() => {
axios({...}).then(...);
}, []);