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

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

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

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

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

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



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. Я установил роли данных для общественности.

спасибо Наби

🤔 А знаете ли вы, что...
React поддерживает создание контролируемых и неконтролируемых компонентов форм.


66
2

Ответы:

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

{
  name: 'xyz',
  rating: 5
}

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

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

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


Решено

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