Разрешить создание новых элементов ArrayInput только в режиме редактирования / создания и сделать существующие неизменяемыми / отображать только существующие.

Я читал документы и форум в течение дня и не нашел решения своего ответа. Мне интересно, возможно ли следующее с помощью response-admin.

У меня есть ресурсные документы, для которых можно создавать шаблоны. Количество шаблонов бесконечно, но после добавления шаблона его нельзя будет редактировать или удалять.

Когда я редактирую документ, я могу редактировать его заголовок и описание или добавлять новые шаблоны, но я не могу изменять / удалять старые.

Посмотрите, например, на это изображение ниже:

Снимок экрана

Под заголовком, описанием и датой создания находится поле ArrayInput с source = 'templates'.

Первая запись соответствует той, которую я уже создал, но она изменчива. Внизу находится простая сетка данных, в которой показаны шаблоны.

Мне либо нужно иметь сетку данных и иметь возможность создавать только новые шаблоны, либо существующие записи в ArrayInput должны быть неизменными.

Есть ли чистый или хитрый способ добиться этого? Если нет, это должна быть функция imo. Что вы думаете?


react-admin admin-on-rest
person Laurents Mohr    schedule 11.10.2018    source источник

Ответы (1)


arrow_upward
1
arrow_downward

Это очень специфический вариант использования, поэтому мы не будем поддерживать эту функцию из коробки. Однако, как объясняется в документации, ArrayInput принимает единственный дочерний элемент реализация итератора, который является компонентом, отвечающим за добавление / удаление и отображение входных данных. Мы предоставляем только SimpleFormIterator, но вы можете создать свой собственный на основе его исходный код.

Я думаю, вам, вероятно, понадобится компонент итератора, принимающий два реквизита рендеринга, один для существующих элементов, которые будут возвращать поля, а другой для новых элементов, которые будут возвращать входные данные. Его можно было бы использовать так:

<ArrayInput source="templates">
    <SimpleFormIterator
        renderExisting={() => ([
            <TextField source="country" />,
            <TextField source="templateId" />,
            <NumberField source="pages" />,
        ])}
        renderNew={() => ([
            <TextInput source="country" />,
            <TextInput source="templateId" />,
            <NumberInput source="pages" />,
        ])}
    />
</ArrayInput>
person Gildas Garcia    schedule 11.10.2018
comment
Спасибо! Работаю над этим :) - person Laurents Mohr; 11.10.2018