我试图使用索引值通过for循环从列表中获取值。但是在获取它们并将它们分配到另一个列表之后,它显示所有的值都是未定义的。如何解决这个问题?
import React, { useEffect, useContext, useState } from 'react';
import { useHistory } from 'react-router-dom';
function Function() {
const history = useHistory();
const [data, setData] = useState({});
const [features, setFeatures] = useState({});
useEffect(() => {
const passingData = history.location.state; //array passed from prev page
setData(passingData);
console.log(data);//log=> {'id':01 ,'name':"name1"},{'id':02 ,'name':"name2"},{'id':03 ,'name':"name3"}
const tFeatures = [];
for (var i = 0; i < 2; i++) {
tFeatures.push(data[i]);
}
console.log(tFeatures);//output => [undefined, undefined, undefined]
}, []);
return <div></div>;
}
export default Function;console.log(data); // {'id':01 ,'name':"name1"},{'id':02 ,'name':"name2"},{'id':03 ,'name':"name3"}console.log(tFeatures) // [undefined, undefined, undefined]发布于 2021-04-17 02:14:25
你为什么不用data代替passingData呢?当你调用console.log(data)的时候,它还没有被设置(它是异步的)。因此,要么使用passingData,要么提取依赖于data的部分并将其放入自己的useEffect()中。
function Function() {
const history = useHistory();
const [data, setData] = useState([]); // should be an array, not an object
const [features, setFeatures] = useState([]); // should be an array, not an object
useEffect(() => {
const tFeatures = [];
for (var i = 0; i < 2; i++) {
tFeatures.push(data[i]);
}
}, [data])
useEffect(() => {
const passingData = history.location.state;
setData(passingData);
}, [history.location.state]);
return <div></div>;
}或
function Function() {
const history = useHistory();
const [data, setData] = useState([]); // should be an array, not an object
const [features, setFeatures] = useState([]); // should be an array, not an object
useEffect(() => {
const passingData = history.location.state;
setData(passingData);
const tFeatures = [];
for (var i = 0; i < 2; i++) {
tFeatures.push(passingData[i]); // use passingData not data
}
}, [history.location.state]);
return <div></div>;
}https://stackoverflow.com/questions/67129885
复制相似问题