Метка поля / ввода на основе записи в реагирующем администраторе

Question

Я бы хотел, чтобы часть записи была включена в метку для BooleanField (и BooleanInput).Я пытаюсь использовать WithProps для достижения этой цели.

Если я использую

<BooleanField source="FileSystem" label="FileSystem" />

Кажется, это работает просто отлично.Если вместо этого я попытаюсь обернуть его

const makeLabel = (props)=>{
    let label = `Filesystem for ${props.record.id}`;

    return {label};
}

const withLabel = withProps(makeLabel);
const BooleanFieldWithLabel = compose(withLabel)((props)=>{
    console.log("props after compose",props);
    return <BooleanField {...props}/>
});

, а затем использовать <BooleanFieldWithLabel source="FileSystem" /> Он не отображает никакой метки.Я пробовал несколько разных способов, и, похоже, ничего не работает, хотя я вижу в console.log, что правильная метка находится в подпорках.Что я тут не так делаю?

Answer 1

У меня тот же вопрос, я не могу отобразить базу меток на значении поля на странице «Показать».Из исходного кода реакции-администратора, кажется, только я установил опору «addLabel» для прямого потомка «SimpleShowLayout» или «TabbedShowLayout», тогда я могу видеть метку в моем настраиваемом поле.

Но это не настраиваетсяЯ хочу показать / скрыть базу меток по значению поля.Нужно ли мне реализовать свой собственный «SimpleShowLayout» или «TabbedShowLayout»?Или есть более подходящие подходы?

Обновите мой пост.Я просто выясняю решение путем реализации HOC, как показано ниже.Мне интересно, есть ли лучшие подходы для реализации той же функции?

import React from "react";
    import get from "lodash/get";
    import { TextField, DateField, Labeled } from "react-admin";

    const NullableField = WrappedComponent => props => {
      const { record, source } = props;
      const value = get(record, source);
      return value ? (
        <Labeled {...props}>
          <WrappedComponent {...props} />
        </Labeled>
      ) : null;
    };
    const NullableTextField = NullableField(TextField);
    const NullableDateField = NullableField(DateField);
    export { NullableTextField, NullableDateField };