反应 mui 数据网格：动态列

Posted 2023-02-22

【中文标题】反应 mui 数据网格：动态列

【英文标题】：react mui datagrid : dynamic column

【发布时间】：2021-11-16 02:26:06

【问题描述】：

如何在获取事件后使用 mui 隐藏/显示 react 中的列。

以 fetch 为例：

const getData=()=>
   fetch(url +'/rha/apicall/getData/'
    ,
      headers :  
        'Content-Type': 'application/json',
        'Accept': 'application/json'
      
        
    )
      .then(function(response)

        enqueueSnackbar('Data Loaded',variant:'info');

        return response.json();
      )
      .then(function(myJson) 
        console.log(myJson);
        console.log(columns);
        columns[1].hide=false;
        rows = myJson.adh;
        setData(myJson)
      );
  

行更新良好，但列不工作。

【问题讨论】：

请。为您的组件提供 Column，以便社区知道如何提供帮助，无需猜测

这无关紧要。列名对问题没有影响。顺便说一句，这些列非常大。

【参考方案1】：

由于没有人给出一个单一的答案，这里有一个：

条件加载。

    const [isLoaded, setLoaded] = React.useState(false);
..

...

 .then(function(myJson) 
        console.log(myJson);
        console.log(columns);
        columns[1].hide=false;
        rows = myJson.adh;
        setLoaded(true);
        setData(myJson)
      );

then in the render :
 isLoaded? 
        <DataGrid.../>
:
<p>Loading</p>

【讨论】：

您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息，例如引用或文档，以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center。

谢谢你的机器人。但是，嘿，这里都说完了。 “使用条件加载”，然后是代码示例。不能做更多，因为我自己回答。