开发者问题收集

如何在 react-admin 中添加自定义操作

2021-05-09
1234

我使用 react-admin,需要向列表视图添加一个自定义按钮,该按钮将导航到特定 API。

我的问题:

  1. 如何创建按钮?我应该在列表中写什么?
  2. 如何将其导航到 API?

谢谢

1个回答

我的解决方法:

  1. 创建自定义按钮:

     import Button from '@material-ui/core/Button';
    import { TopToolbar } from 'react-admin';
    
    const PostShowActions = ({ basePath, data, resource }) => (
    <TopToolbar>
    {/* 添加您的自定义操作 */}
    <Button color="primary" onClick={customAction}>Custom Action</Button>
    </TopToolbar>
    );
    
    export const PostList = (props) => (
    <List action={<PostShowActions />} {...props}>
    ...
    </List
    );
    
  2. 将其导航到 API: 我实现了这样的自定义操作:

    const genarte = () => {
    const httpClient = fetchUtils.fetchJson;
    const apiUrl = "your API";
    httpClient(`${apiUrl}`,{method: "POST"}).then(({ json }) => ({
    data: json,
    })
    
    ); };
    

我知道它不会将页面导航到外部链接,只会发出 http 请求, 但现在对于我的需求来说没问题。

如果您有任何意见或想法如何将页面导航到外部链接,我会很高兴

R H
2021-05-09