一个组件更新时，是否可以防止所有映射的组件重新映射？

如何解决一个组件更新时，是否可以防止所有映射的组件重新映射？？

react应用，该应用使用“地图”数组构建应用，如下所示：

const siteMap = [ Page1: [    SubPage1:[      App1: {        name: "App1",more app info...      },App2: {        name: "App2",...    ],... ],...
]

使用siteMap数组，应用程序通过映射创建，子和应用程序。我的问题是组件更新时，该级别的所有组件都会重新映射。例如，如果某个应用程序组件更新，则所有应用程序都将重新映射。

可能值得注意的是，所有相关组件都是组件。此外，该应用程序还使用React.lazy（）导入并渲染动态的组件。

下面的是该应用程序的缩写版本：

//Page Component
const Page= (props) => {
return (  <div>     {siteMap.map((page) => <SubPage pageData={page})}  </div>
)
export default Page;


//SubPage Component  
const SubPage= (props) => {
return (  <div>     {props.pageData.map((subPage) => <App appData={subPage})}  </div>
)
export default SubPage;


//App Component    
const App = (props) => {
return (  <div>     {props.appData.map((app) => {        const Icon = React.lazy(() => import(`./${app.name}`));        return (           <Suspense fallback={<div>Loading...</div>}>              <Icon />           </Suspense>        )     })}     {app info...}  </div>
)
export default App;

是什么使一组映射的组件重新映射/渲染？如果您有映射到组件的对象数组，那么当其中组件更新时，如何防止该数组重新映射（以及重新渲染所有组件）？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）