Hvordan kan jeg deaktivere funktionen til automatisk genopfriskning af react-admin

Så react-admin ser ud til at have en funktion, hvor hvis du er inaktiv i et stykke tid og kommer tilbage, vil den genindlæse dataene, formentlig for at sikre dig, at du ser på den mest opdaterede version af en post.

Dette forårsager nogle problemer for min redigeringsfunktion, der har nogle brugerdefinerede komponenter. Er der en måde at deaktivere denne automatisk genindlæsningsfunktion?

Svar

Den automatiske opdatering udløses af indlæsningsindikatoren (det spinner-ikon, som du ser øverst til højre på app-bjælken).

Du kan deaktivere automatisk opdatering ved at erstatte indlæsningsindikatoren med din egen.

import * as React from 'react';
import PropTypes from 'prop-types';
import classNames from 'classnames';
import { useSelector } from 'react-redux';
import { makeStyles } from '@material-ui/core/styles';
import CircularProgress from '@material-ui/core/CircularProgress';
import { useRefreshWhenVisible, RefreshIconButton } from 'react-admin';

const useStyles = makeStyles(
    {
        loader: {
            margin: 14,
        },
        loadedIcon: {},
    },
    { name: 'RaLoadingIndicator' }
);

const LoadingIndicator = props => {
    const { classes: classesOverride, className, ...rest } = props;
    useRefreshWhenVisible(); // <= comment this line to disable auto-refresh
    const loading = useSelector(state => state.admin.loading > 0);
    const classes = useStyles(props);
    return loading ? (
        <CircularProgress
            className={classNames('app-loader', classes.loader, className)}
            color="inherit"
            size={18}
            thickness={5}
            {...rest}
        />
    ) : (
        <RefreshIconButton className={classes.loadedIcon} />
    );
};

LoadingIndicator.propTypes = {
    classes: PropTypes.object,
    className: PropTypes.string,
    width: PropTypes.string,
};

export default LoadingIndicator;

Du skal også placere denne knap i en brugerdefineret AppBar, injicere din AppBar i et brugerdefineret layout og bruge det layout i din Admin, som forklaret i react-admin Theming-dokumentationen.