我找到解决办法了。

{ field: 'id', headerName: 'ID', width: 50, hide: true}

这对我来说已经足够了。

根据MUI文档，hide: true现已弃用。
相反，您应该使用列可见性模型。
文档中的示例：

<DataGrid
  initialState={{
    columns: {
      columnVisibilityModel: {
        // Hide columns status and traderName, the other columns will remain visible
        status: false,
        traderName: false,
      },
    },
  }}
/>

在罗宾逊的答案上展开，还有一种编程的方法，我用这段代码在移动的版中隐藏了一些列。

export const MOBILE_COLUMNS = {
  id: true,
  value: true,
  value2: false,
  value3: false,
};
export const ALL_COLUMNS = {
  id: true,
  value: true,
  value2: true,
  value3: true,
};

  const theme = useTheme();
  const matches = useMediaQuery(theme.breakpoints.up("sm"));
  

  const [columnVisible, setColumnVisible] = React.useState(ALL_COLUMNS);
  React.useEffect(() => {
    const newColumns = matches ? ALL_COLUMNS : MOBILE_COLUMNS;
    setColumnVisible(newColumns);
  }, [matches]);

return (
   <DataGrid
       rows={rows}
       columns={columns}
       columnVisibilityModel={columnVisible}
   />
)

不推荐使用GridColDef.hide prop，您应该使用列可见性来隐藏不需要的列：https://mui.com/x/react-data-grid/columns/#controlled-visible-columns

我知道这个问题已经回答过了，但是我遇到的问题是，我需要隐藏一个字段，但是一旦编辑了一行，就需要检索它的值，这也是OP对其中一个答案的评论。
解决方法是将editable属性添加到字段中，如下所示：

{field: 'id', hide: true, editable: true}

尝试移除columns数组中的第一个对象，如下所示

const columns = [
    //{ field: 'id', headerName: 'ID', width: 50}, //or delete it entirely
    { field: 'testName', headerName: 'Test Name', width: 120,},
    { field: 'testDate', headerName: 'Test Date', width: 160 },
]

或者添加属性hide: true和editable: true

const columns = [
        { field: 'id', headerName: 'ID', width: 50, hide: true, editable: true},
        { field: 'testName', headerName: 'Test Name', width: 120,},
        { field: 'testDate', headerName: 'Test Date', width: 160 },
    ]