Как установить кнопку обновления конфигурации отображения / скрытия на appbar

Нажмите, чтобы увидеть изображение

Обновление кнопки на AppBar не обновляется на панели инструментов страницы, потому что я просто использую компонент Card, но работаю на странице, используя компонент List или Datagrid, поэтому я хочу настроить кнопку отображения / скрытия обновления на AppBar или как исправить это, чтобы страница не использовала компонент List или Datagrid.

Извините, я не силен в английском.

Я не понял твоего вопроса. Не могли бы вы подробно рассказать, что вы хотите сделать, что вы пробовали и чего вы ждете?

Kmaschta 10.09.2018 11:41

@Kmaschta Я исправляю детали своего вопроса, надеюсь, вы поймете.

jayyzdayo 11.09.2018 11:20

Извините, но я все еще не понимаю ... Можете ли вы ответить на следующие вопросы короткими предложениями: Что вы пытаетесь сделать? Что ты пытаешься? Чего ты ждешь? А каково текущее поведение? Пожалуйста, покажите нам максимум кода, который вы используете.

Kmaschta 11.09.2018 12:16

@Kmaschta Я тестирую проект в example/demo в репозитории React-admin. Когда я нажимаю кнопку обновления на AppBar на странице, страница панели инструментов не обновляется, но я нажимаю кнопку обновления на AppBar на странице «Клиенты», страница обновляется. Не знаю почему. Итак, как использовать кнопку обновления на странице панели инструментов или настроить отображение / скрытие кнопки обновления

jayyzdayo 11.09.2018 12:53

@Kmaschta Можно настроить скрыть / показать кнопку обновления в правом верхнем углу страницы, и если это не так, как заставить ее работать со страницей, которая не использует список таблиц данных, то есть страница панели инструментов

jayyzdayo 11.09.2018 13:20
0
5
1 216
1
Перейти к ответу Данный вопрос помечен как решенный

Ответы 1

Ответ принят как подходящий

Вам нужно будет получить некоторые данные из состояния response-admin, чтобы оно работало. Действительно, кнопка обновления просто запускает действие refreshView, которое обновляет ключ state.admin.ui.viewVersion в состоянии redux response-admin. Этот ключ представляет собой простой счетчик. Внутри мы используем этот счетчик, чтобы проверить, нужно ли обновлять данные некоторых компонентов. Вот простой пример подключенного Dashboard, который может делать что-то при обновлении:

import React, { Component } from "react";
import { connect } from "react-redux";

class Dashboard extends Component {
  componentDidMount() {
    this.doOnMountAndWhenRefreshed();
  }

  componentDidUpdate(prevProps) {
    if (prevProps.views !== this.props.views) {
      this.doOnMountAndWhenRefreshed();
    }
  }

  doOnMountAndWhenRefreshed = () => {
    // This is where you do update your component:
    // - Make API requests
    // - Fetch data from the react-admin store, etc.
  };

  render() {
    const { views } = this.props;
    return <div>Refreshed {views} times.</div>;
  }
}

const mapStateToProps = state => ({ views: state.admin.ui.viewVersion });

export default connect(
  mapStateToProps,
  {}
)(Dashboard);

Вы можете увидеть, как это работает в этом коды

Редактировать для более новой версии response-admin

import { useVersion } from 'react-admin';

const Dashboard = () => {
    const version = useVersion();
    return <div>Refreshed {version} times.</div>;
}

как мы можем реализовать то же самое с помощью хука useEffect в функциональном компоненте

krypton 02.07.2021 08:10

Используйте как useVersion, чтобы получить версию, так и useRefresh, чтобы получить функцию обновления

Gildas Garcia 02.07.2021 12:30

Я соответственно отредактировал ответ

Gildas Garcia 02.07.2021 14:55

Спасибо @Gildas .. это сработало

krypton 03.07.2021 17:15

Другие вопросы по теме