admin-on-rest - 如何根据过滤器值隐藏 Datagrid 中的列

Question

我们可以List Datagrid根据过滤器值动态显示/隐藏 a 的列吗？

我看不出我们怎么能做到这一点。感谢您对此的任何帮助。

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>
   }
}