Блог

Я пишу руководство по управлению пользователями react-admin и пытаюсь упростить добавление пользователей в группы, т. Е. Добавляя группы со страницы редактирования пользователя с помощью автозаполнения. Начиная с примера, я добился некоторого успеха, используя следующее:

 
   <ReferenceArrayInput
      label="Group"
      source="groups"
      reference="groups"
   >

    <AutocompleteArrayInput
        {...props}
        resettable={true}
        allowEmpty={true}
        optionText="name"
        fullWidth
    />

   </ReferenceArrayInput>

 

Однако этот метод использует Chip компонент для отображения выбранных элементов в строке. Я хотел бы использовать Datagrid вместо этого. Из исходного кода я знаю, что не могу переопределить отображаемую часть автозаполнения (пока?), Поэтому я подумал, что могу прибегнуть к скрытию Chip s с помощью CSS, но мне все равно понадобится способ отображения a Datagrid с текущим выбором. Поэтому я попробовал это (оно завернуто FormWithRedirect , следовательно formProps ):

     <ReferenceArrayField
        {...formProps}
        label="Group"
        source="groups"
        reference="groups"
    >
        <Datagrid>
            <TextField source="name" />
        </Datagrid>
    </ReferenceArrayField>
    <ReferenceArrayInput
        {...formProps}
        label="Group"
        source="groups"
        reference="groups"
    >
        <AutocompleteArrayInput
            resettable={true}
            allowEmpty={true}
            optionText="name"
            fullWidth
        />
    </ReferenceArrayInput>

 

Это работает почти точно так, как я хочу, Datagrid отображается a, и в нем отображаются правильные данные для выбора, однако они не обновляются при AutocompleteArrayInput изменении выбранных элементов. Как бы я ни старался (прошел, вероятно, через все крючки и контексты), я не мог заставить это работать.

Возможно ли это? Как я могу Datagrid обновить, когда выбор меняется AutocompleteArrayInput ?