Создание приложения заметок в стеке MERN https://lutif.github.io/Notes-Keeper/, у меня есть mongodb, я хочу получить заметки в базе данных, а затем отобразить их в веб-интерфейсе. Однако reactjs не позволяет мне инициализировать состояние (call useState) при обратном вызове. как это получить мои данные выборки и использовать его в useState. любой указатель будет полезен.
import React, { useState } from "react";
import Header from "./Header";
import Footer from "./Footer";
import Note from "./Note";
import CreateArea from "./CreateArea";
import addNotedb from '../APICalls/addNote';
import getNotesListdb from '../APICalls/getNotesList';
function App() {
getNotesListdb().then(nojson=>nojson.json()).then( notesListdb=>
{const [notes, setNotes] = useState([...notesListdb]);}
)
function addNote(newNote) {
// const noteId =
addNotedb(newNote);
console.log('calling add note with ', newNote);
// newNote.Id = newNote;
setNotes(prevNotes => {
return [...prevNotes, newNote];
});
}
function deleteNote(id) {
setNotes(prevNotes => {
return prevNotes.filter((noteItem, index) => {
return index !== id;
});
});
}
return (
<div>
<Header />
<CreateArea onAdd={addNote} />
{notes.map((noteItem, index) => {
return (
<Note
key={index}
id={index}
title={noteItem.title}
content={noteItem.content}
onDelete={deleteNote}
/>
);
})}
<Footer />
</div>
);
}
export default App;
const endpoint = '/api/notes';
export default function getNotes() {
let promise =
fetch(endpoint, {
method: "GET",
headers: {
"Content-Type": "application/json",
"Accept": "application/json"
}
}
)
return promise
}