Reactjs 为什么嵌套数组中只有两个级别反映了非变异React状态变量更改中的更改？

我有一个React应用程序，其中显示了一个或多个嵌套数组（最初来自JSON文件）中的数据

我的应用程序中有一个按钮，我想在数组的三个层次上更改项

此按钮调用的函数是下面的

filterUnits

在该函数中，通过数组循环更改需要更改的数据

但是只有前两个级别的更改才会在React页面生效

非静音状态变量是否有数组深度限制，或者为什么第三级深度中的变量更改没有反映在React应用程序中

function PageCurriculum(props: IProps) {
    const [searchText, setSearchText] = useState('');
    const [modelData, setModelData] = useState(initialModelData)
    useEffect(() => {
        props.changeSiteTitle(pageTitle);
    }, []);

    const filterUnits = () => {
        const filteredUnits = modelData.allUnits;
        filteredUnits.forEach((unit: ICurriculumUnit) => {
            unit.title = 'THIS CHANGES THE TITLE';
            unit.subunits.forEach((subunit: ICurriculumSubunit) => {
                subunit.title = 'AND THIS CHANGES THE TITLE';
                subunit.sections.forEach((section: ICurriculumSection) => {
                    section.title = 'BUT THIS TITLE DOES NOT CHANGE!!!';
                    section.show = false;
                });
            });
        });
        setModelData({ ...modelData, filteredUnits: [...filteredUnits] });
    }

    return (
        <div className="pageCurriculum">
            <Helmet>
                <title>{pageTitle}</title>
            </Helmet>

功能页面课程（道具：IProps）{
常量[searchText，setSearchText]=useState（“”）；
const[modelData，setModelData]=useState（initialModelData）
useffect（（）=>{
道具。更改站点标题（页面标题）；
}, []);
常量过滤器单元=（）=>{
const filteredUnits=modelData.allUnits；
filteredUnits.forEach（（单位：ICurrumUnit）=>{
unit.title='这会更改标题'；
unit.subunits.forEach（（subunit:iccurrenumsubunit）=>{
subunit.title='这会更改标题'；
子单元.sections.forEach（（section:ICurrumSection）=>{
section.title='但此标题不会更改！！！'；
section.show=false；
});
});
});
setModelData（{…modelData，filteredUnits:[…filteredUnits]}）；
}
返回(
{pageTitle}