"TableData.js:57 洗掉https://clientdata-dd35a-default-rtdb.firebaseio.com/userDataRecord.json/:${id} net::ERR_FAILED TableData.DeleteData @ TableData.js:57 onClick @ TableData。 js:152 TableData.js:57 Uncaught (in promise) TypeError: Failed to fetch"
我的洗掉按鈕代碼出現此錯誤。洗掉按鈕代碼無法識別 tabledatas 的 id。我正在嘗試但沒有得到輸出。請幫我解決這個問題。我分享我的代碼。
表資料.js 檔案
const db = StartFirebase();
export class TableData extends Component {
constructor() {
super();
this.state = {
tableDatas: []
}
}
componentDidMount() {
const dbRef = ref(db, 'userDatas')
onValue(dbRef, (snapshot) => {
let records = []
snapshot.forEach(childSnapshot => {
let keyName = childSnapshot.key;
let data = childSnapshot.val()
records.push({ "key": keyName, "data": data })
})
this.setState({ tableDatas: records })
})
}
DeleteData=async(id)=>{
await fetch('https://clientdata-dc88a-default-rtdb.firebaseio.com/userDatas.json/:${id}',{
method:'DELETE'
}).then((res)=>{
res.json().then((resp)=>{
alert('delete', id)
})
})
}
render() {
return (
<div>
<table className="table table-bordered table table-hover" id="table-to-xls">
<thead>
<tr>
<th scope="col">ID</th>
<th scope="col">Sr</th>
<th scope="col">House No</th>
<th scope="col">Name</th>
<th scope="col">Action</th>
</tr>
</thead>
<tbody>
{
this.state.tableData.map((row, id) => {
return (
<tr key={id}>
<th scope="row">{id}</th>
<td>{row.data.userDatas.srno}</td>
<td>{row.data.userDatas.house}</td>
<td>{row.data.userDatas.nameMarathi}</td>
<td>{row.data.userData.name}</td>
<td>{<button onClick={()=>this.DeleteData(id)}>Delete</button>}</td>
</tr>
)
})
}
</tbody>
</table>
</div>
)
}
}
uj5u.com熱心網友回復：
這個網址是錯誤的：
https://clientdata-dc88a-default-rtdb.firebaseio.com/userDatas.json/:${id}
訪問 Firebase 實時資料庫的 REST API 時，.json擴展程式始終需要位于 URL 的末尾。
所以：
https://clientdata-dc88a-default-rtdb.firebaseio.com/userDatas/:${id}.json
轉載請註明出處，本文鏈接：https://www.uj5u.com/net/489318.html
標籤：反应 火力基地 firebase-实时数据库