#reactjs #react-admin
#reactjs #react-admin
Вопрос:
Я хотел бы отключить некоторый флажок, созданный пользовательской кнопкой BulkActionsButton. Это простой список:
function CourseList(props): ReactElement {
return (
<List
{...props}
bulkActionButtons={<BulkActionButton />}
>
<Datagrid>
...some fields
</Datagrid>
</List>
);
}
и BulkActionButton
:
const BulkActionButton = ({
resource,
selectedIds,
}: BulkActionProps): ReactElement | null => {
const { data, loading } = useGetMany(
'shared/courses',
selectedIds as Identifier[]
);
if (!data || loading) {
return null;
}
const someHasBeenPaid = data.some((course) => !!course?.invoiceDate);
return (
<Button
color="secondary"
disabled={someHasBeenPaid}
label={t('@app.manager.clientDepartment.invoiceCTA')}
/>
);
};
На самом деле записи, которые имеют a invoiceDate
, не должны проверяться в первую очередь. Но флажки создаются внутри react-admin Я не нахожу никакой документации о том, как применить некоторые фильтры для включения / отключения флажков или, если это вообще возможно.
Ответ №1:
На основе этой документации https://marmelab.com/react-admin/List.html#isrowselectable вы можете использовать isRowSelectable
prop для Datagrid
компонента, чтобы выбрать, можно ли выбирать строку для массовых действий. Вы получаете доступ к записи там, чтобы вы могли принять решение на основе ваших данных:
export const RecordList = props => (
<List {...props}>
<Datagrid isRowSelectable={ record => !record.invoiceDate }>
...
</Datagrid>
</List>
);
Комментарии:
1. Добро пожаловать 🙂 Документы react-admin действительно хороши и очень обширны, но иногда вы не будете уверены, где искать, пока не прочитаете их много 🙂
2. Точно 🙂 Иногда вы теряетесь в этом. Но в последнее время они отлично работают и значительно улучшают как документацию, так и фреймворк. Еще раз спасибо 🙂
3. К вашему сведению, приведенная выше ссылка больше не действует. Похоже, что он был перемещен в: marmelab.com/react-admin/Datagrid.html#isrowselectable