Метка поля / ввода на основе записи в React admin

Я бы хотел, чтобы часть записи была включена в метку для 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, что правильный ярлык находится в props. Что я здесь делаю не так?


reactjs react-admin recompose
person HiveMind118    schedule 17.12.2018    source источник

Ответы (1)


arrow_upward
1
arrow_downward

У меня тот же вопрос, я не могу отобразить базу меток по значению поля на странице «Показать». Из исходного кода response-admin кажется, что только я установил опору 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 };

person yanghl22    schedule 08.01.2019
comment
@raju_eww Спасибо за совет, я только что обновил свой код. - person yanghl22; 08.01.2019