React代码获取请求删除操作需要帮助

Question

我能够发布和获取数据，但无法删除必须是一个问题，我传递到删除笔记功能id。

这些是我的文件:Note.js

import React, {useState} from 'react';
import DeleteIcon from '@material-ui/icons/Delete';
import EditIcon from '@material-ui/icons/Edit';
import SaveIcon from '@material-ui/icons/Save';
function Note(props) {
function handleClick() {
props.onDelete(props.id);
}
const[edit, setEdit]=useState(false);
function editTrue() {
setEdit(!edit);
}
return(
<div className={!edit ? "note" : "note1"}>
<h1 contentEditable={edit && "true"} spellCheck="true">{props.title}</h1>
<hr/>
<p />
<p contentEditable={edit && "true"} spellCheck="true">{props.content}</p>
{!edit && <button onClick={handleClick}><DeleteIcon /></button>}
{edit ? <button onClick={editTrue}> <SaveIcon /> </button> : <button onClick={editTrue}><EditIcon /></button>}
</div>
);
}
export default Note;

App.js

import React, { useState, useEffect } from 'react';
//import { DragDropContext } from 'react-beautiful-dnd';
import Header from './Header';
import Footer from './Footer';
import Note from './Note';
import CreateArea from './CreateArea'
function App() {
const [notes, setNotes] = useState([]);
useEffect(() => {
fetch('https://react-hooks-update-ec587-default-rtdb.firebaseio.com/notes.json')
.then(response => response.json())
.then(responseData => {
const loadedNotes = [];
for( const key in responseData ) {
loadedNotes.push({
id: key,
title: responseData[key].title,
content: responseData[key].content
});
}
setNotes(loadedNotes);
});
}, []);

function addNote(newNote) {
fetch('https://react-hooks-update-ec587-default-rtdb.firebaseio.com/notes.json', {
method: 'POST',
body: JSON.stringify(newNote),
headers: { 'content-Type': 'application/json' }
}).then(response => {
return response.json();
}).then(responseData => {
setNotes(prevNotes => [
...prevNotes,
{ id: responseData.name, ...newNote }
]);
});
}
function deleteNote(noteId) {
fetch(`https://react-hooks-update-ec587-default-rtdb.firebaseio.com/notes/${noteId}.json`,
{
method: 'DELETE'
}
).then(response => {
setNotes(prevNotes => {
return prevNotes.filter((noteItem, index) => {
return index !== noteId;
});
});
});
}
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;

我能做什么改变?当我运行我的文件删除操作在本地工作，但它不会从数据库中删除注释

我能够发布和获取数据，但无法删除必须是一个问题，我传递到删除笔记功能id。

Answer 1

可能是indeleteNotein fetchurlremove.json:

fetch(`https://react-hooks-update-ec587-default-rtdb.firebaseio.com/notes/${noteId}`)