无法使用 useState 钩子设置数组

Question

我正在尝试将数组设置为状态挂钩。基本上我想跟踪每行（网格类型的）编辑对话框打开状态。基本上每一行，我有一个编辑按钮，启动一个 .正如最初呈现的那样，我试图通过在父网格组件中保留一个数组来管理显示隐藏。当用户单击“编辑”按钮时，每行，我想将 rowData 作为 props.data 传递并提供编辑功能。

为了保持 editDialogs 的状态（显示/隐藏），我制作了一组对象 useState 钩子，如下所示：

  const [editDialogsModalState, setEditDialogsModalState] = useState([{}]); // every edit dialog has it's own state
     ...
 function initializeEditDialogsModalState(dataSet) {
    let newState = [];
    dataSet.map((item) => newState.push({ id: item.id, state: false }));
    return setEditDialogsModalState(newState);  // **PROBLEM->Not setting**
  }

function addUDButtons(currentRowDataMovie) {  // my edit/delete button UI code
    const currRowDataId = currentRowDataMovie.id;
    return (
      <span>
        <button
          type="button"
          className="btn btn-info"
          onClick={() => setEditDialogsState(currRowDataId)}
        >
          Edit
        </button>
        {editDialogsModalState[currRowDataId].state && ( // **PROBLEM->null data even after set call**
          <EditMovieComponent
            open={editDialogsModalState[currRowDataId].state}
            onToggle={toggleEditDialogsModalState(currentRowDataMovie)}
            movie={currentRowDataMovie}
          />
        )}
}
     ......
function buildGrid() {
    {
      if (!ready) {
        // data is not there, why to build the grid
        return;
    }
      initializeEditDialogsModalState(movies);
             ...........
}    

但是无法获得editStates。调试器的屏幕截图，我可以在其中看到电影（REST 输出），准备就绪，但不是 editDialogsModalState 状态数组。

一般来说，有没有更好的方法来实现这种基于每行的功能，点击一个按钮我想打开一个 React-bootstrap 并传递特定于行的数据项以进行操作？ （我正在学习 React，所以可能还没有完全了解所有的指针）。

谢谢， 普拉迪普