Swiper 적용시 에러가 발생합니다.

Swiper 모듈 삭제후 버전을 8.3.0으로 재설치 하니까 됬어요. ㅎㅎ

useState 안에 함수를 넘기면 왜 반복실행을 방지할 수 있나요?

해당질문은 https://ko.reactjs.org/docs/hooks-reference.html#lazy-initial-state 여기서 설명하고있습니다. (리액트 공식문서) 참고 해보시면 좋을것 같아요 :)

Post생성 에러가 나옵니다!

등록하는 타이틀은 처음 작성하는 타이틀인데 중복된다는 에러가 이해가 안됩니다..

Post생성 에러가 나옵니다!

이미지 파일이 2개밖에 안올라가서 추가로 댓글로 더 등록. (사진)

에러가 뜨는데 다 고쳐도 원인을 모르겠어요.

넵!!

에러가 뜨는데 다 고쳐도 원인을 모르겠어요.

import { useState, useEffect, useRef } from 'react'; import { useRouter } from 'next/router'; import MsgItem from './MsgItem'; import MsgInput from './MsgInput'; import fetcher from '../fetcher'; import useInfiniteScroll from '../hooks/useInfiniteScroll'; const MsgList = ({ smsgs, users }) => { const {query: { userId = '' },} = useRouter(); const [msgs, setMsgs] = useState(smsgs); const [editingId, setEditingId] = useState(null); const [hasNext, setHasNext] = useState(true); const fetchMoreEl = useRef(null); const intersecting = useInfiniteScroll(fetchMoreEl); const onCreate = async (text) => { const newMsg = await fetcher('post', '/messages', { text, userId }); if (!newMsg) throw Error('something wrong'); setMsgs((msgs) => [newMsg, ...msgs]); }; const onUpdate = async (text, id) => { const newMsg = await fetcher ('put', `/messages/${id}`, { text, userId }); if (!newMsg) throw Error('something wrong'); setMsgs((msgs) => { const targetIndex = msgs.findIndex( (msg) => msg.id === id); if (targetIndex 0) return msgs; const newMsgs = [...msgs]; newMsgs.splice(targetIndex, 1, newMsg); return newMsgs; }); doneEdit(); }; const onDelete = async (id) => { const receivedId = await fetcher( 'delete', `/messages/${id}`, { params: { userId }, }); setMsgs((msgs) => { const targetIndex = msgs.findIndex( (msg) => msg.id === receivedId + ''); if (targetIndex 0) return msgs; const newMsgs = [...msgs]; newMsgs.splice(targetIndex, 1); return newMsgs; }); }; const doneEdit = () => setEditingId(null); const getMessages = async () => { const newMsgs = await fetcher( 'get', '/messages', { params: { cursor: msgs[msgs.length - 1]?.id || '' }, }); if (newMsgs.length === 0) { setHasNext(false); return; } setMsgs((msgs) => [...msgs, ...newMsgs]); }; useEffect(() => { if (intersecting && hasNext) getMessages(); }, [intersecting]); return ( MsgInput mutate={onCreate} /> ul className="messages"> {msgs.map((x) => ( MsgItem key={x.id} {...x} onUpdate={onUpdate} onDelete={() => onDelete(x.id)} startEdit={() => setEditingId(x.id)} isEditing={editingId === x.id} myId={userId} user={users[x.userId]} /> ))} ul> div ref={fetchMoreEl} /> ); }; export default MsgList; import MsgInput from './MsgInput'; const MsgItem = ({ id, userId, timestamp, text, onUpdate, onDelete, isEditing, startEdit, myId, user, }) => ( li className="messages__item"> h3> {user.nickname}{' '} sub> {new Date(timestamp).toLocaleString( 'ko-KR', { year: 'numeric', month: 'numeric', day: 'numeric', hour: '2-digit', minute: '2-digit', hour12: true, })} sub> h3> {isEditing ? ( MsgInput mutate={onUpdate} text={text} id={id} /> ) : ( text )} {myId === userId && ( div className="messages__buttons"> button onClick={startEdit}>수정button> button onClick={onDelete}>삭제button> div> )} li> ); export default MsgItem;

에러가 뜨는데 다 고쳐도 원인을 모르겠어요.

http://localhost:3000/?userid=roy 이렇게 입력해도 똑같습니다.. ㅠㅠ

에러가 뜨는데 다 고쳐도 원인을 모르겠어요.

(사진)

현재 시점으론 scf말고 vue도 안되는데 어떻게 해야 할까요?

이거 최신버전에서는 vbase로 하시면 됩니다.

질문있습니다.

감사합니다. 이제 정확히 이해됬습니다!