Страница администратора React отображается некорректно

Я не знаю, почему у вас возникают эти проблемы, описание слишком общее, и кажется, что вы не представляете, в чем проблема, вероятно, из-за того, что вы новичок в этой области. В любом случае возникшая у вас проблема, вероятно, связана с CSS, который позволяет придать стиль вашей странице. Но React Admin не использует CSS напрямую, вы можете использовать его таким образом, но для более динамичного способа стилизации страницы библиотека Материал-интерфейс использует вещь под названием JSS для применения стилей.

Существует множество библиотек, которые используются вместе для создания React Admin, вы должны понимать самые важные из них, чтобы делать что-то необычное. Мой вам совет, поскольку вы новичок и делаете вид, что используете React Admin, сначала используйте то, что предлагает React Admin, и когда вы почувствуете себя комфортно, используя эти компоненты и получите общее представление о том, как работает фреймворк, после этого начните реализовывать свои собственные компоненты, которые не не имеет прямого отношения к React Admin, но использует некоторые из тех же библиотек React Admin.

Также проверьте, создаете ли вы приложение React Admin с помощью компонента <Admin> или встраиваете ли React Admin в другое приложение, так как второе более вероятно приведет к ошибкам.

После некоторой отладки я думаю, что выяснил причину этой проблемы. У меня была настраиваемая кнопка для дублирования строки (в основном публикуйте создание и маршрут для редактирования страницы с новым идентификатором). По какой-то причине рендеринг этой кнопки, кажется, непоследовательно вызывал эту проблему. Фактическая кнопка работает нормально, но вызывает такое непоследовательное поведение. Ниже приведен код этой кнопки. Есть ли проблема с приведенным ниже ?:

export default class DuplicateButton extends Component {

constructor(props) {
    super(props);
    this.handleClick = this.handleClick.bind(this);
    this.state = ({ redirect: false });
    var redirectPath = '';

}

handleClick = (props) => {
    var
        {
            push, record, resourceName
        } = this.props;
    let tempRecord = record;
    var result = '';
    console.info(this.props);
    var p = restDataProvider(CREATE, this.props.resource + "/" + tempRecord.id, { data: tempRecord }).then(resp => {
        result = resp.data;
        let routePath = '/' + this.props.resource + '/' + result.id;
        console.info(routePath);
        this.redirectPath = routePath;
        this.setState({ redirect: true });
        return result;
    });

}

render() {
    if (this.state.redirect) {
        console.info('Redirect to Edit page');
        return <Redirect push to = {this.redirectPath} />;
    }

    return <Button variant = "flat" color = "primary" label = "Duplicate Entry" onClick = {this.handleClick}><DuplicateIcon /></Button>;
}
}