如何根据过滤值隐藏DataGrid列

Question

我们可以动态显示/隐藏的List Datagrid基于过滤器值的列？

我看不出我们如何能做到这一点。感谢有这方面的帮助。

Answer 1

这是不可能的默认ra-ui-materialui List组件。你必须实现自己的，使用它作为一个起点。

随意打开描述用例https://github.com/marmelab/react-admin库功能要求的问题。

Answer 2

您可以参考这个链接，自定义数据网格列：https://github.com/fizix-io/ra-customizable-datagrid

或者，你可以让你列表组件的状态组件，并实现在像切换按钮列表组件自己的操作。

例如：

class MoreDetails extends Component {

  constructor() {
    super();
    this.state = {
      showDetails: false
    };
  }

  toggleDetails = () => {
    const toggle = this.state.showDetails;
    this.setState((prevState, props) => {
      return {
        showDetails: !toggle,
      }
    });
  }
  render() {
    const { classes, ...props } = this.props;
    const MyActions = ({ basePath, data, resource }) => (
        <CardActions style={cardActionStyle}>
            <Button 
            color="primary" 
            onClick={this.toggleDetails}
            >Toggle Details</Button>
        </CardActions>
    );
   return <List 
      actions={<MyActions />}
      {...props}  >
      <Datagrid>
         <TextField source="c1" label="Column1" />
         <TextField source="c2" label="Column2" />
         {this.state.showDetails ? 
         <TextField source="c3" label="Column3" /> : null }

         <TextField source="c4" label="Column4" />
          {this.state.showDetails ?
         <TextField source="c5" label="Column5" /> : null }
         </Datagrid>
    </List>
   }
}