Страпи и форма реагирования не добавляют данные в админку

Предыдущий выпуск

Создание рейтингового приложения с использованием страпи и реакции выдает ошибки решено.

Но записи не добавляются в админку.

Может ли кто-нибудь помочь в этом?

Это код для добавления и чтения отзывов от администратора страпи,



function App() {
    const stars = Array(5).fill(0);
    const [currentValue, setCurrentValue] = React.useState(0);
    const [hoverValue, setHoverValue] = React.useState(undefined);

    const handleClick = (value) => {
        setCurrentValue(value);
    };

    const handleMouseOver = (value) => {
        setHoverValue(value);
    };

    const [review, setReview] = useState({});
    const [reviews, setReviews] = useState([]);
    useEffect(() => {
        const fetchData = async () => {
            const result = await api.readReviews();
            //console.info(result.data);
            setReviews(result.data.data);
        };
        fetchData();
    }, []);
    const createReview = async () => {
        try {
            //console.info(review);
            const data = await api.createReview(review);
            setReview([...reviews, data]);
        } catch (error) {
            //console.info(error);
        }
    };
    let [reviewCount, setreviewCount] = useState([]);
    const setCountFxn = (no) => {
        setReview(no);
    };

    return (
        <>
            <form>
                <div style = {styles.container}>
                    <h2>RATE OUR SERVICE</h2>

                    <div style = {styles.stars}>
                        {stars.map((_, index) => {
                            return (
                                <FaStar
                                    key = {index}
                                    size = {24}
                                    style = {{
                                        marginRight: 10,
                                        cursor: 'pointer',
                                    }}
                                    color = {(hoverValue || currentValue) > index ? colors.orange : colors.grey}
                                    onClick = {() => {
                                        setReview({ ...review, Rating: index + 1 });
                                    }}
                                    onMouseOver = {() => handleMouseOver(index + 1)}
                                />
                            );
                        })}
                    </div>
                    <div>
                        <input
                            type='text'
                            placeholder='input your name'
                            required
                            style = {styles.input}
                            value = {review.Name}
                            onChange = {(e) => setReview({ ...review, Name: e.target.value })}
                        />
                    </div>

                    <textarea
                        placeholder = "what's your feedback"
                        required
                        style = {styles.textarea}
                        value = {review.review}
                        onChange = {(e) => setReview({ ...review, review: e.target.value })}
                    />
                    <button type='submit' style = {styles.button} className='btn btn-primary' onClick = {createReview}>
                        submit
                    </button>
                </div>
            </form>

            <section id='reviews'>
                <div className='reviews-heading'>
                    <span>REVIEWS FROM CUSTOMERS</span>
                </div>

                <div className='container'>
                    <div className='row'>
                        {reviews.map((review, i) => (
                            <div key = {review.id} className='col-md-6'>
                                <div className='reviews-box'>
                                    <div className='box-top'>
                                        <div className='profile'>
                                            <div className='name-user'>
                                                <strong>{review.attributes.Title}</strong>
                                            </div>
                                        </div>

                                        <div style = {styles.stars}>
                                            {Array.from({ length: review.attributes.Rating }).map((i) => (
                                                <FaStar key = {i} size = {18} color = {colors.orange} />
                                            ))}
                                        </div>
                                    </div>

                                    <div className='client-comment'>{review.attributes.Body}</div>
                                </div>
                            </div>
                        ))}
                    </div>
                </div>
            </section>
        </>
    );
}


export default App;

Форма отправляется и перезагружается после отправки, но запись не добавляется в админку strapi. Я установил роли данных для общественности.

Спасибо Наби

Пара мыслей: 1. Вы подтвердили, что у вас есть права доступа к конечной точке api.createReview? 2. Можете ли вы записать data после этой строки: const data = await api.createReview(review); Я предлагаю использовать Postman для проверки вашей конечной точки. Также проверьте свою консоль Strapi, если вы попали в конечную точку, вы должны там что-то увидеть.

Thremulant 18.11.2022 17:59

1. как мне подтвердить, что у меня есть разрешение?, 2. я добавил журнал, но при отправке ничего не отображается. Я попытался добавить запись в почтальон, но получил эту ошибку: «данные»: ноль, «ошибка»: { «статус»: 400, «имя»: «ValidationError», «сообщение»: «Отсутствует полезная нагрузка «данные» в тело запроса", "детали": {} }

Nabi Arshad 18.11.2022 18:18

Мне нужно добавить токен любого вида?

Nabi Arshad 18.11.2022 18:20

Из этой ошибки кажется, что объект, который вы отправляете, не имеет некоторых свойств. Можете ли вы зарегистрировать этот объект перед его отправкой?

Thremulant 18.11.2022 18:54

Что касается разрешений, вы можете проверить их в Настройках/Ролях. Если вам нужно получить доступ к данным без входа в систему, проверьте общедоступную роль и убедитесь, что ваша схема (я полагаю, просмотр) имеет разрешение на CREATE and UPDATE. Если к вашим данным должен получить доступ аутентифицированный пользователь, просто проверьте другую роль и подтвердите, что у нее есть эти разрешения.

Thremulant 18.11.2022 18:58
Хук useOnClickOutside в ReactJS
Хук useOnClickOutside в ReactJS
Как разработчик ReactJS, вы, возможно, сталкивались с ситуацией, когда вам нужно закрыть модальное или выпадающее меню, когда кто-то щелкает за его...
Хуки (часть-2) - useEffect
Хуки (часть-2) - useEffect
Хук useEffect - один из самых мощных и универсальных инструментов в арсенале разработчика React. Он позволяет вам управлять побочными эффектами в...
[LXI-SpartaCodingClub Full-Stack Bootcamp in Indonesia] 2023/1/21 TIL/Week 15]
[LXI-SpartaCodingClub Full-Stack Bootcamp in Indonesia] 2023/1/21 TIL/Week 15]
Я научился создавать карусель в ReactJS с помощью библиотеки Splide.
Краткое введение в Styled-компоненты
Краткое введение в Styled-компоненты
В настоящее время популярность Styled-компонентов становится все больше и больше. Большинство проектов, построенных на React.js, используют эту...
ДЕНЬ 8 | Страница обзора в React
ДЕНЬ 8 | Страница обзора в React
На этом сегодня все, завтра снова увидимся с новым проектом!
Как настроить среду разработки React.
Как настроить среду разработки React.
Весь процесс настройки среды разработки react.
0
5
66
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Вам нужна очень специфическая структура, чтобы создать новую запись с помощью страпи. Я предполагаю, что ваша полезная нагрузка выглядит так:

{
  name: 'xyz',
  rating: 5
}

Правильно будет:

{
  data: {
    name: 'xyz',
    rating: 5
  }
}

Документы Strapi — Создание записи

Как мне добавить запись через код в функции createReview? Не могли бы вы прислать пример с использованием моего кода?

Nabi Arshad 18.11.2022 20:58

Ну а если структура действительно такая (это знаете только вы, просто логируйте свои данные), то можно сделать const data = await api.createReview({data: review})

Xzandro 18.11.2022 21:05
Ответ принят как подходящий

Я понял это! Значения формы были названы неправильно. «Имя» должно быть «Название», а «обзор» — «Основная часть». Теперь он добавляет данные в админку strapi.

Другие вопросы по теме