在带有钩子的useEffect中的Promise函数中的setState？
在带有钩子的useEffect中的Promise函数中的setState是指在React函数组件中使用useEffect钩子函数，并在其中使用Promise函数来进行异步操作，并在异步操作完成后使用setState来更新组件的状态。
具体来说，useEffect是React提供的一个钩子函数，用于在函数组件中执行副作用操作，比如订阅事件、数据获取、DOM操作等。在useEffect中，可以传入一个回调函数和一个依赖数组，依赖数组用于指定在哪些依赖发生变化时才重新执行useEffect。
当在useEffect中使用Promise函数进行异步操作时，可以通过.then()方法或async/await语法来处理异步操作的结果。在异步操作完成后，可以使用setState来更新组件的状态，从而触发组件的重新渲染。
使用setState可以通过传入一个新的状态对象来更新组件的状态。React会自动合并新旧状态，并进行高效的DOM更新。更新状态后，React会重新渲染组件，并根据新的状态值来更新组件的UI。
在使用Promise函数中的setState时，需要注意以下几点：
- 确保在异步操作完成后再调用setState，以避免出现不一致的状态。
- 可以使用函数式的setState形式，以确保更新状态时基于最新的状态值进行更新，而不是基于旧的状态值。
- 在依赖数组中添加相关依赖，以确保在依赖发生变化时重新执行useEffect。
以下是一个示例代码，演示了在带有钩子的useEffect中的Promise函数中的setState的用法：
import React, { useEffect, useState } from 'react';
const MyComponent = () => {
const [data, setData] = useState([]);
useEffect(() => {
const fetchData = async () => {
try {
const response = await fetch('https://api.example.com/data');
const result = await response.json();
setData(result);
} catch (error) {
console.error(error);
}
};
fetchData();
}, []);
return (
<div>
{data.map(item => (
<p key={item.id}>{item.name}</p>
))}
</div>
);
};
export default MyComponent;在上述代码中，我们定义了一个函数组件MyComponent，并在其中使用了useState和useEffect钩子函数。在useEffect中，我们使用了一个异步函数fetchData来获取数据，并在获取数据完成后使用setData来更新组件的状态。最终，我们将获取到的数据渲染到组件的UI中。
腾讯云相关产品和产品介绍链接地址：
- 腾讯云函数计算（云原生）：https://cloud.tencent.com/product/scf
- 腾讯云数据库（数据库）：https://cloud.tencent.com/product/cdb
- 腾讯云服务器（服务器运维）：https://cloud.tencent.com/product/cvm
- 腾讯云CDN（网络通信）：https://cloud.tencent.com/product/cdn
- 腾讯云安全产品（网络安全）：https://cloud.tencent.com/product/saf
- 腾讯云音视频处理（音视频、多媒体处理）：https://cloud.tencent.com/product/mps
- 腾讯云人工智能（人工智能）：https://cloud.tencent.com/product/ai
- 腾讯云物联网（物联网）：https://cloud.tencent.com/product/iotexplorer
- 腾讯云移动开发（移动开发）：https://cloud.tencent.com/product/mob
- 腾讯云对象存储（存储）：https://cloud.tencent.com/product/cos
- 腾讯云区块链（区块链）：https://cloud.tencent.com/product/baas
- 腾讯云虚拟专用网络（VPC）：https://cloud.tencent.com/product/vpc
- 腾讯云容器服务（容器）：https://cloud.tencent.com/product/ccs
- 腾讯云云原生应用引擎（云原生）：https://cloud.tencent.com/product/tke
- 腾讯云云服务器负载均衡（负载均衡）：https://cloud.tencent.com/product/clb
- 腾讯云云安全中心（安全）：https://cloud.tencent.com/product/ssc
- 腾讯云云数据库Redis版（数据库）：https://cloud.tencent.com/product/redis
- 腾讯云云数据库MongoDB版（数据库）：https://cloud.tencent.com/product/cosmosdb
- 腾讯云云数据库TDSQL版（数据库）：https://cloud.tencent.com/product/tdsql
- 腾讯云云数据库CynosDB版（数据库）：https://cloud.tencent.com/product/cynosdb
- 腾讯云云数据库DCDB版（数据库）：https://cloud.tencent.com/product/dcdb
- 腾讯云云数据库MariaDB版（数据库）：https://cloud.tencent.com/product/mariadb
- 腾讯云云数据库SQL Server版（数据库）：https://cloud.tencent.com/product/sqlserver
- 腾讯云云数据库PostgreSQL版（数据库）：https://cloud.tencent.com/product/postgres
相关·内容
当道具更改时更新状态时， 将使用带有道具的useEffect()作为依赖项：
const Component = ({prop}) => {
const [state, setState] = useState(prop);
useEffect(() => {
setState(prop);
}, [prop]);
return <div>{state}</div>;
}
我想知道，与直接在组件中进行比较相比，这样做有什么好处吗？
const Component = ({prop}) => {
const [state
浏览 0提问于2020-03-11得票数 1
回答已采纳
2回答
我有一个基于选项卡的页面。每个选项卡都会带有标签，以便在单击时切换选项卡。我在该州的setValue中添加了useEffect。 PageManager文件： const RolePageManager = () => {
let location = useLocation()
let { uuid } = useParams()
const [tabIndex, setTabIndex] = useState(0)
useEffect(() => {
if (location.hash) {
switch (location.hash) {
case &
浏览 29提问于2020-08-06得票数 0
我的react应用程序中有下一个组件：
import React, { useEffect, useState } from "react";
import AsyncSelect from "react-select/async";
import { ColourOption, colourOptions } from "./docs/data";
const App = () => {
const [state, setState] = useState([]);
useEffect(() => {
set
浏览 9提问于2021-12-14得票数 0
我对这个现象很好奇。我使用useEffect服务器时间，并使用setState其他值。但它只在控制台上被射中了两次。useEffect很多调用，但只有两次在控制台上。任何知道原因的人，请帮助..。
import { useEffect, useState } from 'react';
function Test() {
const [value, setValue] = useState(0);
useEffect(() => {
setValue(prev => prev + 1)
}, [])
useEffect(() =>
浏览 2提问于2021-06-08得票数 1
回答已采纳
2回答
伙计们，我想转换这个代码：
export default class App extends Component {
constructor(props) {
super(props);
this.state = { isLoading: true };
}
performTimeConsumingTask = async () => {
return new Promise((resolve) =>
setTimeout(() => {
resolve('result');
},
浏览 1提问于2020-05-07得票数 0
回答已采纳
2回答
我无法导出默认的{class}。我不知道为什么。我得到这个错误：
我对在这里在类外使用const有一些疑问，但当我放入它时，它看起来不会起作用。
有人看到我的错误了吗？我是个新手。对我温柔点。
提前谢谢。
下面是我的代码：
import React, { useEffect, useState, useRef, Component } from 'react';
import '../App.css';
import Nav from './Nav'
import SearchBox from './SearchBox'
impo
浏览 0提问于2020-07-24得票数 0
3回答
我看到了react v16中引入的这两个新概念。
根据我的理解：
useState类似于带有钩子的setState，useEffect的工作方式类似于生命周期方法。
我的理解正确吗？如果不是，useState和useEffect的确切区别是什么？
浏览 0提问于2018-11-09得票数 39
回答已采纳
我试图在功能组件的useEffect挂钩中使用rxjs。
我相信useEffect可以像componentDidMount和componentDidUpdate一样使用。
const Counter = () => {
const [state, setState] = useState({counter: 0});
useEffect(() => {
subscriber.subscribe((value) => {
let { counter } = state;
counter += value;
set
浏览 0提问于2019-06-14得票数 0
回答已采纳
4回答
我正在学习React，但是我无法理解为什么我在控制台中得到了这个输出。心地善良的人可以详细解释一下“行刑”哦，这些钩子？
import { useState, useEffect } from "react";
function Homepage() {
const [state, setState] = useState();
useEffect(() => {
console.log("useEffect");
console.log("useEffect not executed");
setState
浏览 24提问于2022-04-20得票数 1
我有一个函数，当表单值发生变化时会调用它。一旦它发生了变化，我就想从API中重新获取数据。我以前的setState在课堂上就是这样做的。 我想使用钩子，但是当你有一个useState设置函数时，我发现没有promise回调。 updateState = name => ({ target: { value } }) => {
this.setState({ [name]: value }, () => {
this.doConversion();
});
}; 如果我有像useEffect()这样的调用fetchData();的东西，考虑
浏览 8提问于2020-04-12得票数 1
回答已采纳
1回答
我试图构建一个简单的导航条，但是当我在useEffect中定义一个useEffect函数时，呈现的错误比预期的要少。这可能是意外的早期返回语句造成的。我看了同样的答案，但直到无法修复
这是我的代码
import React,{useEffect,useState} from 'react'
import {AppBar ,Toolbar, Container ,makeStyles,Button, IconButton} from '@material-ui/core'
import MenuIcon from '@material-ui/icons/M
浏览 3提问于2021-02-05得票数 0
回答已采纳
我想将useSelector与useEffect一起使用，因为dispatch(searchEvents(location.search))返回一个promise，并且只有在promise解析后，我才能使用react-redux中的useSelector()挂钩，因为来自useDispatch()的react-redux dispatch将更新我将用来呈现列表的redux存储 const [text, setText] = useState("");
const [priceFilter, setPriceFilter] = useState("");
浏览 51提问于2021-06-27得票数 0
假设我有以下代码：
const ReactFunction = ({...props}) => {
useEffect(() => { props.function(props.value) }, [props.value])
return <input value={props.value} onChange={props.onChange} />
}
const ReactFunctionWrapper = () => {
const [value, setValue] = setState(0)
const logger = (e) => {c
浏览 2提问于2020-07-31得票数 4
回答已采纳
我有一个状态，存储当前应用的主题，无论是黑暗还是光明。我使用useEffect钩子将状态更改存储在localStorage中，以便当用户刷新页面时，他们的首选主题将被保存，另一个useEffect钩子将在初始加载期间更新我的状态。但是，在初始加载期间，我的状态不会更新。
我尝试过的事情：
确保将初始加载期间的useEffect放在 useEffect之前，以存储主题状态使用的承诺，以确保只有在加载上状态发生更改后，才能触发changeTheme函数，因此我知道localStorage在保存状态或跟踪更改方面没有任何问题，但在第一个useEffect钩子中的setState函数没有正确更新我的状
浏览 0提问于2021-11-10得票数 2
回答已采纳
当我在useEffect参数中使用来自组件的函数时，我知道我应该编写一个callback，以便将它作为useEffect的依赖项来记忆和使用，否则就会有一个警告，但是当我使用setState of useState时，为什么不需要编写回调。它是默认记忆的吗？与组件中的方法不同，setState of useState是如何工作的？
const [username, setUsername] = useState(undefined)
const [password, setPassword] = useState(undefined)
const onSuccessfulLogin = u
浏览 0提问于2020-07-13得票数 0
回答已采纳
在useEffect的依赖数组中定义setState值的想法是什么？
const [someState, setSomeState] = useState();
...
useEffect(() => {
// Do something
setSomeState('some value');
}, [setSomeState]);
React Hook useEffect has a missing dependency: 'setSomeState'.
Either include it or remove the dependency arra
浏览 4提问于2020-01-13得票数 18
回答已采纳
2回答
假设我有一个简单的虚拟组件：
const Component = () => {
const [state, setState] = useState(1);
setState(1);
return <div>Component</div>
}
在这段代码中，我将状态更新为，与前面直接在组件体中的值相同。但是，即使值保持不变，这也会导致太多的重呈现。
正如我所知，在React.useState中，如果状态值被更新为与前面相同的值- React将不会重新呈现组件。为什么会发生在这里？
然而，，如果我尝试使用useEffect做一些简单的事情，而不是
浏览 14提问于2022-10-11得票数 7
回答已采纳
setState异步更新状态。我的理解是，在使用类组件时，您可以这样做，以确保在一个setState更新状态之后执行某些代码：
setState({color: red}, callbackThatExecutesAfterStateIsChanged);
我使用的是一个功能组件&钩子。我知道，在这里，useEffect()的回调将在状态更改之后和初始执行时每次执行时执行。
useEffect(callback, [color]);
如何复制类组件示例中类似的行为？？即，在one setState()成功地更改状态而不是在初始执行之后，在one setState()成功地更改状态之后，
浏览 3提问于2020-11-30得票数 2
我有一个使用redux和钩子的反应性无状态组件。我需要显示页面加载(useEffect)上的项目数，并在每次添加或删除项(store.subscribe)时更新它。
useEffect(() => {
setState({
items: store.getState().items.length
});
}, []);
store.subscribe(() => {
setState({
items: store.getState().items.length
});
});
但这会导致控制台显示警告，无法对未挂载的
浏览 13提问于2019-11-25得票数 7
回答已采纳
如果第二个setState钩子依赖于您，那么如何实现这个简单的逻辑？在本例中，第一个setState值在运行第二个setState之前更新不够快。我已经尝试过将第二个超时，以及将其放入第一个回调函数中。没能成功。useEffect可能会解决这个问题，但在这个特殊的例子中，我只需要在第一个实例中调用useEffect，而不是每次状态发生更改时都调用useEffect。告诉我你的想法。
function blah(arg) {
if (condition) {
setState(arg)
}
setState(state + 1)
}
浏览 3提问于2022-01-11得票数 0
回答已采纳
function SomeComponent(props)
{
const [state, setState] = useState();
}
对于这样的组件，react能确保setState和props始终是同一个对象实例吗？
在我测试的时候，我相信是这样的。在许多官方示例中，setState和props没有添加到useEffect的依赖列表中。
但是我没有找到任何关于这方面的文件。还有其他类似它们的物体吗？
浏览 0提问于2020-11-13得票数 1
const [ state, setState] = useState({
casas: [],
casaSelecionada: '',
});
useEffect(()=>{
dbref.once('value', function(snapshot, prevChildKey){
setState({
casas:(Object.entries(snapshot.val())).map( e => e[1].casaItem),
});
});
dbref.off
浏览 29提问于2020-04-17得票数 1
我想在react native中启动一个计时器间隔而不使用useEffect钩子，如果我想在promise解析时启动一个计时器并每秒更改一个状态变量，我如何在不使用useEffect钩子的情况下做到这一点？
我试过这个：
useEffect(
() => {
const id = setInterval(() => {
setCounter(counter+1)
}, 1000);
return () => {
clearInterval(id);
};
},
[] // empty
浏览 0提问于2021-07-21得票数 0
问题的关键是：如何使用上下文中的数据触发useEffect?
据我理解钩子的规则，它们都必须在函数的顶端，所以这可能是违反的，对吗？
export const MyComponent = () => {
const appContext = useContext(AppContext);
const {dispatch, state} = appContext; // destructuring in front of another hook
useEffect(()=>{
// Do something with state here
浏览 0提问于2019-07-17得票数 2
回答已采纳
目前试用的反应钩和反应悬念。我正在尝试制作一个钩子useApolloQuery，它将获取一些数据，并承诺等待数据加载。
我将逻辑用于在useEffect中获取数据，但如果您立即在组件中抛出承诺(并因此挂起它)，效果似乎永远不会运行。
这是我的代码：(或代码框链接： )
function createPromiseResolver() {
let resolve;
const promise = new Promise(newResolver => {
resolve = newResolver;
});
return { resolve, promise };
浏览 0提问于2019-02-13得票数 1
回答已采纳
1回答
我有一个自定义钩子，它接收可观测值数组作为参数，然后(在useEffect钩子中)在可观测值发出值时设置内部状态。
export const myHook = (obs$: Observable<any>) => {
const [state, setState] = useState();
useEffect(() => {
obs$.subscribe((x) => setState(x));
}, [obs$]);
return state;
}
这会导致无限循环，我猜是因为obs$对象上的某些属性在解析过程中发生了
浏览 3提问于2022-04-21得票数 1
4回答
在调用setInterval函数之前，我已经将状态设置为true。但是，即使使用状态的新值来触发useEffect钩子，它也没有反映在setInterval函数中。
这里的代码沙箱：
let interval;
const Component = () => {
React.useEffect(() => {
console.log('State updated to', state);
});
const [state, setState] = React.useState(false);
const on = () => {
浏览 1提问于2019-08-13得票数 4
回答已采纳
在我的应用程序中，我创建了一个自定义钩子来发出API请求：
const useRequest = (promise) => {
const [data, setData] = useState({});
const [loading, setLoading] = useState(false);
const [error, setError] = useState({});
useEffect(() => {
let ignore = false;
const fetchProduct = async () => {
try {
浏览 0提问于2020-07-30得票数 0
1回答
从钩子中返回价值承诺
、、、
所以我试图成为一个聪明的人--$$，并从钩子中返回一个承诺(这样我就可以等待这个值，而不是等待钩子在其解析和钩子重新运行后给我的值)。我试着做这样的事情，一切都很顺利，直到解决为止。.then似乎从未运行过，这告诉我，我设定的决心并没有正确启动。下面是代码：
function App() {
const { valPromise } = useSomeHook();
const [state, setState] = React.useState();
React.useEffect(() => {
valPromise.then(r => {
浏览 2提问于2022-10-21得票数 3
回答已采纳
我有一个在子级和其父级之间传递的props代码：
Parent.js
const defaultState = {
canOperate: false,
// among other states
};
const [state, setState] = useState(defaultState);
// this technique is for avoiding some re-renders in some occasions, I'm using a lot of this way to set the
// state in this Parent compon
浏览 2提问于2021-04-14得票数 1
我正在尝试编写一个钩子，它执行动态import并返回一个Promise，它在导入完成后解析。
下面是我对它的用法的设想：
await useAfterImport("@custom/path");
以下是我的错误尝试：
const useAfterImport = (importPath:string) => {
return new Promise<void>((resolve) => {
useEffect(() => {
import(importPath).then(() => {
resolv
浏览 3提问于2021-06-22得票数 2
回答已采纳
我有两个useEffect挂钩，它们都将在startTime/endTime状态的变化中运行。
useEffect(() => {
if (selectedProduct) {
fetch(...)
.then(res => res.json())
.then(res => setMyState(res.data));
}
}, [selectedProduct, startTime, endTime]);
useEffect(() => {
if(selectedStep){
c
浏览 2提问于2021-05-19得票数 0
回答已采纳
我创建了一个自定义钩子，该钩子根据不同类型的数据维护状态，如下所示：
import { useState, useRef, Dispatch } from 'react';
function useBackedState<TData, TBacking>(initialData: TBacking, converter: (backing: TBacking) => TData):
[
state: TData,
getBackingData: () => TBacking,
setData: Dispatch<TBacking>
浏览 7提问于2022-08-20得票数 0
回答已采纳
我有一个数据数组(由日期组成)，需要对其中的每个日期运行一个graphql查询。为数组中的每个日期解析的Promise应该返回新数据，我希望将其推送到react组件的本地状态。
但不知何故，该函数只返回数组最后一个元素的数据。
...
const [
getInvoiceByDateQuery,
{ loading: getInvoiceByDateQueryLoading, data: getInvoiceByDateQueryData },
] = useLazyQuery(GET_INVOICES_BY_DATA, {
浏览 1提问于2021-03-20得票数 1
所以，这应该是非常简单的，但我真的很努力。我想做一个报价生成器。我有一个对象数组，每个对象包含一个引号和它的作者。
我有一个按钮，每次单击它时，我都想用从数组中随机选择的对象更新状态。
这就是我所在的地方，我尝试了很多方法，但都没有正常工作。
以下是代码
import React, { useEffect, useState } from "react";
import ReactDOM from "react-dom";
const Myarray = [
{
quote: "Well, Ted, like I said the last
浏览 2提问于2021-02-13得票数 0
当我使用它时，labs字段只更新一毫秒，之后就消失了。
// the pagination component
const [state, setState] = useState({
pageCount: 0,
currentPage: 0,
labs: [],
});
useEffect(() => {
labPageCount()
.then((res) => setState({ ...state, pageCount: res.data.pageCount }))
.catch(console.lo
浏览 0提问于2022-01-29得票数 0
回答已采纳
我开始使用Hook，但在处理多个useEffect时遇到问题 当前钩子代码： //1st useEffect should run only on DidMount
React.useEffect(()=>{
//Calling API only on didMount
},[])
//2st useEffect should run on Context value Changes
React.useEffect(()=>{
//Processing Context Foo and Context Bar on didMount and didUpdate
},[fo
浏览 29提问于2021-03-22得票数 1
在我的React应用程序中，我遇到了一些奇怪的行为，其中setEffect的状态(比如state1)作为第二个参数，在没有调用setState1的情况下改变了另一个变量(而不是状态)。因此，我编写了以下代码，以查看是否会发生相同的情况，并做到了：
import React, { useState, useEffect } from 'react';
function App() {
let [state1, setState1] = useState('');
let count = 0;
useEffect(() => {
co
浏览 1提问于2020-09-25得票数 2
回答已采纳
我使用一个React来检测某个元素何时在视图中可见。在此之前，一切正常工作，但我需要‘重置’的状态时，一切都是隐藏的(如到达页脚或页眉)。
这是我的钩子：
import { useState, useEffect, useRef } from 'react'
const useIntersect = (ref) => {
const [isOnScreen, setIsOnScreen] = useState(false)
const observerRef = useRef(null)
useEffect(() => {
observerR
浏览 5提问于2021-12-23得票数 3
回答已采纳
我对我的助手有意见。我通过一个元素数组映射以获得它们各自的id。然后，在useEffect()中，我调用每个API将一个信息存储在一个数组中。
每次组件更改时，都会成功地设置状态。但是，whenI刷新页面，什么都不会发生，状态保持为空。我知道这是关于useEffect的异步特性的，但是我不知道如何解决这个问题。这是我的代码：
const [array, setArray] = useState([])
const ids = ['id1','id2',...]
const apiCall = () => {
const getEle
浏览 7提问于2022-08-04得票数 0
2回答
我一直在读关于钩子和它们的一些好处的文章，但似乎在苹果和橙子之间有一些比较，在高层次上，钩子组件只是带有依赖注入的伪类。例如，类setState与钩子setState。你不能真正比较这两者，因为它们的行为是不同的。行为上的差异不是由于函数或类，而是因为react实现了这两个函数。来自useState和其他钩子的值只是由依赖项容器解析的伪类属性，并在每次呈现后创建和销毁。似乎react是在说使用钩子组件而不是类，因为类混淆了人和机器，但本质上是使用类概念，但称它们为其他东西。好的代码和坏的代码是独立于类和函数的，并且取决于您将问题分解成小块的程度，因此使用钩子转移到功能组件看起来就像是横向移动。
浏览 1提问于2019-12-02得票数 1
1回答
我在一个类组件中编写了一个非常简单的示例：
setErrorMessage(msg) {
this.setState({error_message: msg}, () => {
setTimeout(() => {
this.setState({error_message: ''})
}, 5000);
});
}
在这里，我调用setState()方法，并给它一个回调作为第二个参数。
我想知道我是否可以在带有useState钩子的功能组件中完成这个任务。
如
浏览 2提问于2020-05-16得票数 3
回答已采纳
1回答
我有一个I数组，存储在ids中，我正在对异步函数asyncFunc进行映射。我希望将映射结果存储到newArr中，然后通过setState更新状态。这是我的密码：
useEffect(() => {
const newArr = [];
ids.map((element) => {
asyncFunc(variables).then((data) => {
newArr.push({ layer: makeLayer(data) });
});
});
setState([...layers, ...ne
浏览 1提问于2022-04-21得票数 0
回答已采纳
我有3个子组件更新相同的父状态对象。我希望每个子类只更新对象中自己的字段。我怎样才能做到这一点？
我想这样做，这样我就可以跟踪每个孩子的状态。
const Child = ({ setState, state, which }) => {
// this was a hack to stop the infinite rerendering - ideally i don't do this but i don't know how to deal with it
const [hasUpdated, setHasUpdated] = useState(false
浏览 7提问于2022-01-06得票数 2
回答已采纳
我想调用一个异步函数并获得我的UseEffect的结果。
我在互联网上找到的fetch api示例是直接在useEffect函数中生成的。如果我的URL改变了，我必须修补我所有的数据。
当我尝试的时候，我收到了一条错误信息。
这是我的密码。
async function getData(userId) {
const data = await axios.get(`http://url/api/data/${userId}`)
.then(promise => {
return promise.data;
浏览 2提问于2019-07-01得票数 81
回答已采纳
在这个reactjs文档中，关于自定义钩子的例子
import React, { useState, useEffect } from 'react';
function useFriendStatus(friendID) {
const [isOnline, setIsOnline] = useState(null);
useEffect(() => {
function handleStatusChange(status) {
setIsOnline(status.isOnline);
}
ChatAPI.subscr
浏览 1提问于2019-12-05得票数 1
回答已采纳
我有以下代码，我收到了两个警告：
警告:无法对未挂载的组件执行反应状态更新。这是一个非操作，但它表示您的应用程序中存在内存泄漏。若要修复，请取消useEffect清理函数中的所有订阅和异步任务。unmountComponentAtNode()：要卸载的节点是由另一个React副本呈现的。
import React, { useState, useEffect } from "react";
import GravatarList from "./GravatarList";
import Header from "./Heade
浏览 7提问于2022-02-09得票数 3
我有两个部件，一个放在另一个里面。子组件打印父组件传递的状态，并使用useEffect更新状态一次。在父组件中，我使用setState (一个具有布尔值的对象)并将状态传递给所有子组件。
父组件：
export default function App() {
const [state, setState] = useState({
one: false,
two: false,
three: false
});
return (
<div className="App">
<h1>Hello Co
浏览 4提问于2021-08-02得票数 3
回答已采纳
1回答
我想要获取到API并将它们存储在React钩子中。以下内容不起作用。当我只使用一个fetch (没有Promise.all)做类似的模式时，它工作得很好。
const [first, setFirst] = useState(null);
const [second, setSecond] = useState(null);
useEffect(() => {
getData();
}, []);
async function getData() {
let [res1, res2] = await Promise.all([
f
浏览 7提问于2022-06-23得票数 0
回答已采纳
这是我的附带项目，我想使用一个返回用户数据的异步函数。因此，我在useEffect之外声明了异步函数，并尝试在异步函数中使用setState。
当我在console.log res中时，它显示了我所期望的结果，但是当我console.log在异步getData函数之外时，它将不能工作。
为什么setUsersData(setState)不能像我预期的那样工作呢？
const FeedPage = () => {
const [usersData, setUsersData] = useState()
const getData = useCallback(async () =&
浏览 3提问于2022-08-18得票数 2
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
对象存储
实时音视频
即时通信 IM活动推荐
腾讯云开发者
