代码之家 › 专栏 › 技术社区 › Aldo

在react admin中创建自定义操作我看不到链接到我的数据提供程序的位置

react-admin admin-on-rest react-redux reactjs

0

Aldo · 技术社区 · 6 年前

我遵循本教程在React admin(rest上的前管理员)中创建自定义操作: using a custom action creator .

我的代码如下:

UpdatePage与教程中的ApproveButton非常相似:

// Update Page.js  
import React, { Component } from 'react';  
import PropTypes from 'prop-types';  
import { connect } from 'react-redux';  
import { updatePage } from '../../actions/pages';  
import Button from '@material-ui/core/Button';  

class UpdatePage extends Component {  
    handleClick = () => {  
        const { record } = this.props;  
        updatePage(record.id, record);  
    }  

    render() {
        return <Button disabled={this.props.disabled} onClick={this.handleClick}>Confirmar</Button>;
    }
}

UpdatePage.propTypes = {
    disabled: PropTypes.bool.isRequired,
    updatePage: PropTypes.func.isRequired,
    record: PropTypes.object,
};

export default connect(null, {
    updatePage
})(UpdatePage);`

//in ../../actions/pages.js  
import { UPDATE } from 'react-admin';

export const UPDATE_PAGE = 'UPDATE_PAGE';
export const updatePage = (id, data) => ({
    type: UPDATE_PAGE,
    payload: { id, data: { ...data, is_updated: true } },
    meta: { fetch: UPDATE, resource: 'pages' },
});

1 回复 | 直到 6 年前

1

3

vahissan 6 年前

您直接在 handleClick 方法。你需要使用 updatePage 在道具内部运行,以正确地调度redux操作。

handleClick = () => {  
    const { record } = this.props;  
    this.props.updatePage(record.id, record);  
}