使用 <List/>在 React-Admin 仪表板上 [英] Use <List /> on React-Admin dashboard

问题描述

我将 react-admin v2.3.2 与自定义仪表板组件一起使用，如 react-admin 教程中所示.

I'm using react-admin v2.3.2 with a custom dashboard component as shown in the react-admin tutorial.

    <Admin dashboard={MyDashboard}>
       <Resource name="incidents ... />
    </Admin>

现在我想使用 react-admin 的组件在我的仪表板上显示事件列表，但是 react-admin 抱怨缺少诸如hasEdit"之类的属性.

Now I'd like to display a list of incidents on my dashboard using the component of react-admin but react-admin complains about missing properties like 'hasEdit'.

我只是将仪表板组件的道具传递给列表，但这显然不起作用:

I simply passed the props of the dashboard component to the List but this does obviously not work:

    class MyDashboard extends React.Component    {
      constructor(props) {
      super(props)

      render(
        return <List {...this.props}>
          <Datagrid> .... </Datagrid>
        </List>

      )
    }

是否可以在仪表板上使用 react-admin 的 <List/> 组件，如果可以，如何实现?

Is it possible to use react-admin's <List /> component on the dashboard and if so how can this be done?

提前致谢，托马斯

推荐答案

我终于通过伪造所需的道具成功地使用了 react-admin 的组件.在 MyDashboard 组件中，我定义了组件所需的道具:

I finally managed to use react-admin's components by faking the required props. Within the MyDashboard component I define props required by the component:

    let fakeProps = {
        basePath: "/incidents",
        hasCreate: false,
        hasEdit: false,
        hasList: true,
        hasShow: false,
        history: {},
        location: { pathname: "/", search: "", hash: "", state: undefined },
        match: { path: "/", url: "/", isExact: true, params: {} },
        options: {},
        permissions: null,
        resource: "incidents"
    }

    <List {...fakeProps}>
      <DataGrid>
        <TextField .... />
      </DataGrid>
    </List>

这确实是一个次优解决方案，但在第一次运行时它解决了我的问题.

This is indeed a sub-optimal solution but in the first run it solves my problem.

这篇关于使用 <List/>在 React-Admin 仪表板上的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！