Javascript 如何在变量更改时重新渲染贴图函数？

这是一篇摘录，应该能说明我的问题。在我的项目中，我对网格做了一些事情，现在我想重置它，但我不知道它是如何工作的，因为如果我更改网格变量，.map（）函数不会重新渲染。我希望你理解我的问题，你能帮助我

这是我的代码：

导出默认函数App（）{
常量getInitialGrid=（）=>{
常量网格=[]；
for（设行=0；行<20；行++）{
const currentRow=[]；
for（设col=0；col<50；col++）{
currentRow.push（[]）；
}
grid.push（当前行）；
}
返回网格；
};
const grid=getInitialGrid（）；
返回(
{grid.map（函数（行，rowIdx）{
返回(
{row.map（函数（节点，colIdx）{
返回hi；
})}
);
})}
);
}

非常感谢

你应该用钩子

import React, { useState } from 'react';

export default function App() {
    // App code
    const [grid, setGrid] = useState(getInitialGrid());
    // more App code

然后，如果您想为网格分配一个新值并导致重新渲染，您可以这样做（在应用程序组件中）：

---

React components only在状态或道具更新（或其父重渲染器）时重渲染，此组件既没有状态也没有道具，因此它将仅在其父重渲染器更新时重渲染。您是否可以更新您的问题以包括重置任何内容或更新网格的尝试？不确定，但您可以在组件装载时移动

getInitialGrid

，并在卸载时删除它，

useffect（（）=>{setState（getInitialGrid（））；return（）=>setState（）；}，[]）

，将其设置为新状态

const[state，setState]=useState（）。谢谢@AdriSolid，这很有效
import React, { useState } from 'react';

export default function App() {
    // App code
    const [grid, setGrid] = useState(getInitialGrid());
    // more App code

setGrid(yourNewGrid);