reactjs - 调用updateState时如何阻止React网站冻结？

Question

我有一个使用数据库（DynamoDB）中的数据加载材料表的页面。

初始表加载很好，但是在大约第 4 个项目之后将项目添加到表中时，本地主机网站会冻结。

我已经追查到它是由 updateState 调用引起的，该调用正在获取新旧表数据并更新状态。

这是代码：

初始数据获取：

const [tableData, updateTableData] = useState([{}])

    useEffect( () => {
    async function refreshData()
    {
      console.log("Init load")
      var invData = await GetPartByType(props.itemType);
      updateTableData( invData )
    }
    refreshData()
  }, [])

更新数据功能：

function updateData(newData)
{
    console.log("Updating Data")
    const invData = [...tableData, newData]
    updateTableData( invData )
}

当 updateData() 被调用约 4 次时，网站冻结，每个条目变得越来越慢

任何帮助表示赞赏！

标签： reactjswebreact-hooksfreeze