我不能在回调axios中更改状态（我使用了use效应，useState，axios）
function User() {
const [user, setUser] = useState({})
useEffect(() => {
const user-token = window.localStorage.getItem('user-token');
const getUser = async () => {
if (user-token !== null) {
const user = await axios.get('http://localhost:5000/api/index/info')
setUser(user.data.info)
console.log(user.data.info) // server return result is what I expected: {name: "hanh", age: 20}
console.log(user) // but this is not change, it still {}
}
getUser()
}, []
}
共有3个答案
function User() {
const [userState, setUserState] = useState({})
useEffect(() => {
const userToken = window.localStorage.getItem('userToken');
const getUser = async () => {
if (userToken !== null) {
const user = await axios.get('http://localhost:5000/api/index/info')
setUserState(user.data.info)
console.log(user.data.info) // server return result is what I expected: {name: "hanh", age: 20}
}
getUser()
}, [])
useEffect(() => {
console.log(userState)
},[userState])
}
或者，如果在其他地方使用userInfo，则如下所示
function User() {
const [userState, setUserState] = useState({})
const userRef = useRef({})
useEffect(() => {
const userToken = window.localStorage.getItem('userToken');
const getUser = async () => {
if (userToken !== null) {
const user = await axios.get('http://localhost:5000/api/index/info')
setUserState(user.data.info)
userRef.current = user.data.info // somewhere else can acquire userinfo by userRef.current
console.log(userRef.current)
}
getUser()
}, [])
}
移除这些
console.log（user.data.info）
console.log（user）
加上这个
useEffect(() => {
console.log(user)
},[user])
js prettyprint-override">function User() {
const [user, setUser] = useState({})
useEffect(() => {
const user-token = window.localStorage.getItem('user-token');
const getUser = async () => {
if (user-token !== null) {
const user = await axios.get('http://localhost:5000/api/index/info')
setUser(user.data.info)
}
}, []);
useEffect(() => {
console.log(user)
},[user]);
}
这是因为setUser异步运行，并且console.log（user）在状态更新之前执行。
您可以使用useffect检查状态是否已更新。
例如：
useEffect(() => {
console.log(user)
}, [user])
效果将在每次用户更改时执行
如果你想在每次状态改变时都有一个回调，那么你可以写如下所示
function useStateWithCallBack(initlaValue, callBack) {
const [state, setState] = useState(initlaValue);
useEffect(() => callBack(state), [state]);
return [state, setState];
}
您可以在此沙盒中找到此类customHook的工作示例：
-
当状态更改时，组件的更新程度如何？比方说，当状态A发生变化时，我可以读取render in组件的控制台日志。我想知道useState语句会发生什么情况，因为初始值设置为1，因为不应该忽略初始值。当我调用某个函数时，a现在变为2，但如果发生重新排序，const[a，setA]=useState（1）会发生什么情况？ 对于useEffect，当状态A发生变化时，我还认为useEffect会被重新声明（
-
我正在构建一个制表符视图，我不明白为什么useState钩子没有更新我的状态。我肯定这是件容易的事，但我在这里已经被难住了一段时间... 我可以看到onPress函数已启动，如果我注销，则item.label是正确的。但是，即使我硬编码参数，setState也不会更改。
-
我正在尝试使用axios接收的数据，使用useState更新组件的状态。问题是“setCursos”不更新“cursos”，它以空数组开始。我试过很多东西，但似乎都不管用。请帮忙。这是a公司迄今为止所做的： 这就是我在express中看到的： aa和我获取数据的json文件：
-
我不熟悉React钩子和React 16.13.1。 我将实现能够处理登录的Auth组件。 但是它似乎没有正确更新状态，即使使用响应对象调用。 这个代码有什么问题？
-
我正在尝试使用注册功能组件中的useState更新组件的状态。当用户输入无效的电子邮件地址并单击“提交”按钮时，以下代码将返回错误消息 我想用这段代码将错误消息设置为formData。 如何将错误消息设置为formData？ 这是我的密码：
-
我有以下代码 我的期望是，若map中并没有值（数组），它将返回对新创建的数组的引用，我可以将我的“值”添加到该数组中。 然而，我看到myContext映射是空的。看起来超基本的，我不明白。