Reactjs 如何基于JS对象的属性强制React组件重新渲染？

我正在用ReactJS构建一个音乐应用程序

我有一个包含曲目的播放列表（这是我自定义类TrackObj的对象实例）

当一个轨迹被点击时，我会调用一个API来获取一些数据；通过我的TrackObj函数getTrackDatas（）

该函数更新my TrackObj项目的IsapireRequest属性：

现在，我想将该属性“链接”到我的React Track组件：

playlist.tracks.map((track,key) => {
  return (
    <li
    key={key}
    >
      <Track
      track={track}
      apiLoading={track._isApiRequest}
      />
    </li>
  )
})

export const Track = (props) => {

  const track = props.track;
  const [apiLoading,setApiLoading] = useState(false);

  useEffect(() => {
    setApiLoading(track._isApiRequest);
  }, [track._isApiRequest]);

  ...

}

它也无法正确更新apiLoading状态

我想在重新渲染项目时有些东西我不懂

你怎么能做到这一点

---

谢谢

默认情况下，组件的状态或道具更改时（或其父组件重新渲染时），组件将重新渲染。如果值的更改需要导致重新渲染，则该值应处于状态。因此，将加载状态设置为状态，然后当更改它时，组件将重新呈现我在第二次尝试中所做的效果（请参阅问题的底部）；而且它不起作用……除了@Jayce444所说的之外，请尝试通过将_isapi加载置于状态来确保父渲染函数正在运行。这将运行render函数，子对象将使用新的道具进行渲染。我不明白。@gordie是的，但在第二次尝试中，您将

轨迹的属性作为依赖项。因此，除非该道具发生变化，否则该效果将无法运行，如果它无法运行，则不会更改
apiLoading
状态，因此不会发生重新渲染（这就是为什么我猜测该方法仍然不起作用的原因）。您是否能够使用虚拟数据来模拟API内容来重新创建一个沙盒
export const Track = (props) => {

  const track = props.track;
  const [apiLoading,setApiLoading] = useState(false);

  useEffect(() => {
    setApiLoading(track._isApiRequest);
  }, [track._isApiRequest]);

  ...

}