Использование response-admin, Как создать комментарий к посту

Я использую response-admin для нового проекта. Одна из проблем, с которой я имею право, - создать что-то вроде комментария к сообщению. Вот как я пытаюсь это сделать <CreateButton basePath='/prescriptions' label="prescriptions" record={data}/>. Проблема, с которой я столкнулся, - это использовать запись данных в форме сообщения для создания комментария, это означает, что я хочу отправить post_id с другими данными из commentForm. Заранее спасибо за помощь.


person thecassion    schedule 25.06.2018    source источник
comment
Возможный дубликат Как я могу добавить ‹CreateButton› (заполнение внешнего ключа) в ReferenceManyField в admin-on-rest   -  person Christiaan Westerbeek    schedule 26.06.2018
comment
@ChristiaanWesterbeek, как ты с этим справился? Я могу читать в SimpleForm данные, которые передаю в CreateButton.   -  person thecassion    schedule 26.06.2018
comment
Я все еще в процессе его реализации ... Не беспокойтесь, комментируя мои планы и не прося меня обещать, что я опубликую ответ   -  person Christiaan Westerbeek    schedule 26.06.2018
comment
Я работаю над сообщением в блоге об этом. Будьте на связи :)   -  person Gildas Garcia    schedule 27.06.2018


Ответы (1)


Что ж, сообщение, которое я упомянул в этом комментарий будет опубликован в ближайшее время. Кроме того, мы собираемся поддерживать это по умолчанию в 2.2.0. А пока вот что вы можете сделать:

import { parse } from "query-string";

const CommentCreate = props => {
    // Read the post_id from the location which is injected by React Router and passed to our component by react-admin automatically
    const { post_id: post_id_string } = parse(props.location.search);

    // Optional if you're not using integers as ids
    const post_id = post_id_string ? parseInt(post_id_string, 10) : '';

    return (
        <Create {...props}>
            <SimpleForm
                defaultValue={{ created_at: today, post_id }}
            >
                // ...
            </SimpleForm>
        </Create>
    );
}

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

import CardActions from '@material-ui/core/CardActions';
import ChatBubbleIcon from "@material-ui/icons/ChatBubble";
import { Button } from 'react-admin';

const AddNewCommentButton = ({ record }) => (
    <Button
        component={Link}
        to={{
            pathname: '/comments/create',
            search: `?post_id=${record.id}`
        }}
        label="Add a comment"
    >
        <ChatBubbleIcon />
    </Button>
);

И, наконец, как мы используем его вместе с ReferenceManyField в компоненте post Show (будет работать и в Edit):

const PostShow = props => (
    <Show {...props}>
        <TabbedShowLayout>
        ...
            <Tab label="Comments">
                <ReferenceManyField
                    addLabel={false}
                    reference="comments"
                    target="post_id"
                    sort={{ field: "created_at", order: "DESC" }}
                >
                    <Datagrid>
                        <DateField source="created_at" />
                        <TextField source="body" />
                        <EditButton />
                    </Datagrid>
                </ReferenceManyField>
                <AddNewCommentButton />
            </Tab>
        </TabbedShowLayout>
    </Show>
);

Вы можете увидеть это в действии в этой codeandbox

Изменить: сообщение опубликовано https://marmelab.com/blog/2018/07/09/react-admin-tutorials-form-for-related-records.html

person Gildas Garcia    schedule 06.07.2018
comment
Отличный материал, Гильдас! Нужно ли будет изменить решение, которое вы здесь предоставили, после того, как эта функция будет поддерживаться по умолчанию в версии 2.2? - person Shawn K; 06.07.2018
comment
Не все, и это также зависит от ваших потребностей. Create сможет инициализировать свои значения либо из состояния местоположения, либо из поиска. Однако мы не будем поддерживать, например, целочисленный синтаксический анализ идентификатора по умолчанию, поэтому это решение все равно будет актуально для некоторых случаев. - person Gildas Garcia; 07.07.2018
comment
Сообщение опубликовано, я добавил ссылку в свой ответ - person Gildas Garcia; 09.07.2018