Итак, я пытаюсь создать базовое приложение для комментариев, используя reactjs, у меня есть бэкэнд NestJS, который, как я знаю, уже работает, поскольку я создал HTML-страницу с голыми костями, чтобы проверить концепцию.
В основном в новом «сообщении» я пытаюсь установить состояние комментариев равным [...comments, newComment], чтобы сохранить предыдущие комментарии.
Но каждый раз, когда я получаю сообщение с сервера, мое состояние (комментарии) перезаписывается новым сообщением и не сохраняет никаких данных.
Я устранил неполадки, и похоже, что состояние (комментарии) вообще не устанавливается? Вот мой код:
const socket = io('http://localhost:4000');
function App() {
const [comments, setComments] = useState([
]);
function newComment(comment) {
console.info("Request for new comment: ");
console.info(comments);
setComments([...comments, comment]);
}
useEffect(() => {
console.info("Comments updated to: ")
console.info(comments);
}, [comments]);
useEffect(() => {
socket.on("message", data => {
const theComment = data.data;
let leComment = { id: 4, name: 'ted', comment: theComment }
newComment(leComment);
});
}, []);
Вот моя консоль в хроме для отладки:
Любая помощь или предложения очень ценятся, я застрял на этом уже целый день!
Конечный результат, который я ищу, - это просто любое новое «сообщение», которое приходит, комментарий в этом сообщении добавляется к моему состоянию, которое называется комментариями.
Проблема, которую я вижу здесь, заключается в следующем
setComments([...comments, comment])
попробуй изменить в
setComments(comments => [...comments, comment])