Javascript ReactJS:调用setLoading时状态未更改

调用addItems（）函数时，我将加载状态更改为true。但它始终是错误的。我错过了什么

const Persons = props => {
  const [data, setData] = useState([]);

  useEffect(() => {
    addItems();
  }, []);

  let [position, setPosition] = useState(
    (props && props.match && props.match.params.placeholder) || 0
  );

  const [loading, setLoading] = useState(false);

  const numOfItem = 4;

  const addItems = () => {
    setLoading(true);
    const items = [...data];

    for (let i = 0; i < numOfItem; i++) {
      const newItem = getData[position];
      // if no item is found than go out from that loop
      if (!newItem) break;
      position++;
      items.push(newItem);
    }

    setData(items);
    setPosition(position);
    setLoading(false);
  };

  return (
    <>
      {data.map(p => (
        <Person person={p} />
      ))}

      <button onClick={addItems}>Quick Load More {numOfItem} items</button>
   </>
  );
};

const Persons=props=>{
const[data，setData]=useState（[]）；
useffect（（）=>{
addItems（）；
}, []);
让[position，setPosition]=useState(
（props&&props.match&&props.match.params.placeholder）| 0
);
const[loading，setLoading]=useState（false）；
常量numOfItem=4；
常量附加项=（）=>{
设置加载（真）；
常量项=[…数据]；
for（设i=0；i(
))}
快速加载更多{numOfItem}项
);
};

---

在devtools中，我看到加载状态始终保持为false。

您可能需要将加载状态设置为

true

并在设置所有项目后将加载状态更改为false。

您可能需要将加载状态设置为

true

并在设置所有项目后将加载状态更改为false。

设置状态为异步。状态更改是成批进行的，因此

addItems

中的状态更改代码根本不能像您期望的那样工作。让

加载

以

true

开始，然后在加载项目后将其设置为false。加载为true时，我需要显示一个微调器，如下所示

{！！加载&加载
}{data.map（p=>（））}

设置状态为异步。状态更改是成批进行的，因此

addItems

中的状态更改代码根本不能像您期望的那样工作。让

load

以

true

开始，然后在加载项目后将其设置为false。当加载为true时，我需要显示一个微调器，如下

{！！加载和加载
}{data.map（p=>（））}