Заголовок React-admin не отображается на панели навигации

Question

Похоже на простую вещь. Как мне поставить заголовок на панели навигации? Вот мое приложение. js:

import React from 'react';
import { Admin, Resource } from 'react-admin';
import { UserList } from './Users';
import { ItemList, ItemEdit, ItemCreate } from './Items';
import { ProductTypeList, ProductTypeEdit, ProductTypeCreate } from './ProductType'
import Dashboard from './Dashboard'
import jsonServerProvider from 'ra-data-json-server';
import dataProvider from './dataProvider';
import ItemIcon from '@material-ui/icons/ViewListRounded';
import ProductTypeIcon from '@material-ui/icons/LocalOffer';
import UserIcon from '@material-ui/icons/Group';
import authProvider from './authProvider'

const App = () => (
  <Admin
    dashboard={Dashboard}
    authProvider={authProvider}
    dataProvider={dataProvider} >
    <Resource
      name="items"
      list={ItemList}
      edit={ItemEdit}
      create={ItemCreate}
      icon={ItemIcon} />
    {<Resource
      name="productTypes"
      options={{ label: 'Product Types' }}
      list={ProductTypeList}
      edit={ProductTypeEdit}
      create={ProductTypeCreate}
      icon={ProductTypeIcon} />}
    <Resource
      name="users"
      list={UserList}
      icon={UserIcon} />
  </Admin >
);

export default App;

Под управлением Reaction-Admin версии 3.4.2. В учебном пособии после добавления панели инструментов в качестве заголовка отображается «React Admin». Но после воссоздания приложения fre sh с использованием npm create-Reaction-app и прохождения учебника я не вижу заголовка в панели навигации. Это то, что должно быть возможно из коробки или мне нужно создать собственную панель навигации?

Answer 1

Поезд (выше) заставил меня задуматься о компоненте. Я импортировал его и использовал в нем и установил title = "My Title", и он отображался в панели навигации. Может быть, я неправильно прочитал документы, но я не помню, чтобы что-то видел, только атрибут title =, например:

  <Admin
    // layout={CustomLayout}
    dashboard={Dashboard}
    authProvider={authProvider}
    dataProvider={dataProvider} >
    <Title title="g3tools Admin" />
    <Resource
      name="items"
      list={ItemList}
      edit={ItemEdit}
      create={ItemCreate}
      icon={ItemIcon} />

Но, к счастью, он возвращает меня к следующему шагу: теперь название отображается в панели навигации, но когда я выбираю ресурс в левом меню, имя ресурса добавляется к заголовку.

Любые предложения о том, как избежать заголовка ресурса, втиснутого в заголовок администратора? Я уверен, что упускаю что-то очевидное. Возможные варианты: а) динамически добавлять пробел или да sh после заголовка, когда отображается заголовок ресурса, или б) не отображать заголовок ресурса (как бы я это сделал?)

Я думаю, что в конечном итоге Я предпочел бы иметь хлебные крошки или показывать заголовок ресурса в центре панели навигации, но, возможно, мне понадобится панель навигации для этого ?? Любое руководство приветствуется.

ОБНОВЛЕНИЕ: в я вижу документы по настройке панели приложений , как не показывать заголовок страницы отдельного ресурса: просто удалите id = "response-admin-title" из компонента, а затем добавить текст к элементу:

<AppBar {...props}>
  <Typography
    variant="h6"
    color="inherit"
    className={classes.title}
  >g3tools Admin</Typography>
</AppBar>

Answer 2

посмотрите в документах , попробуйте это

<Admin
   // add the title prop below
   title="my page title"
   dashboard={Dashboard}
   authProvider={authProvider}
   dataProvider={dataProvider} >