为什么状态更新时组件不重新渲染？

Question

MultiScreens 传递了一个 index 属性来控制它显示的内容。单击 Button 会触发更新处理程序，该处理程序更改 MultiScreens 用于其索引的 state 属性。单击 Button 时，状态会发生变化，但传入的 indexState 似乎没有变化。当 indexState 更改时，如何使 MultiScreens 重新呈现？

export default function Modal() {
    const [indexState, setIndexState] = useState({idx: 0});
    
    const onIncrement = (e) => {
        let newIndexState = {
            idx: indexState.idx + 1
        }
        setIndexState(newIndexState)
    }

  return (
        <>
            <MultiScreens index={indexState}/>
            
            <Button onClick={onIncrement}>
                increment index
            </Button>
        </>
  );
}

Answer 1

我覆盖了 MultiScreen 中的索引。