是否可以在 react-admin 中使用 startUndoable 和自定义操作？答案

【问题标题】：Is it possible to use startUndoable with custom action in react-admin?是否可以在 react-admin 中使用 startUndoable 和自定义操作？
【发布时间】：2019-01-22 16:11:07
【问题描述】：

我想知道将带有自定义获取和类型（不是更新）的自定义操作传递给 startUndoable 是否可行。

或者是否有可能以某种方式在 meta 中定义具有值的模式，并基于此模式重新渲染视图？

在这种情况下，IMPORT 仅使用固定值更新数据库中的一个属性。

这是动作：

export const importParcel = ({ id }) => ({
    type: IMPORT_PARCEL,
    payload: {
        id
    },
    meta: {
        resource: 'parcels',
        fetch: IMPORT,
        refresh: true,
        onSuccess: {
            notification: {
                body: 'Parcel Imported',
                level: 'info'
            }
        },
        onFailure: {
            notification: {
                body: 'Error: Import failed',
                level: 'warning'
            }
        }
    }
});

这是处理程序：

fetchUtils
.fetchJson(`/${resource}/import/${params.id}`, {
    method: 'PUT',
    headers: getAuthenticationHeaders()
})
.then(res => ({ data: res.json }));

感谢您的帮助！ :)

【问题讨论】：

标签： javascript reactjs react-admin

【解决方案1】：

当然，正如Optimistic Rendering and Undo 文档中所述，您可以使用startUndoable 创建任何您想要的操作：

import { startUndoable as startUndoableAction } from 'ra-core';

class App extends Component {
    handleImport = () => {
        this.props.startUndoable(importParcel());
    };

    render() {
        return <Button onClick={this.handleImport}>Import Parcel</Button>;
    }
}

export default connect(null, { startUndoable: startUndoableAction })(App);

您的操作必须具有onSuccess 通知才能显示撤消按钮。

其余的应该在您的数据提供者中实现。

【讨论】：