[英]Cannot call a function from iterated part of html in react
我有一個代碼循環遍歷 reactjs 中的數組中的元素。 對於每個元素,我都有一個刪除按鈕,它應該從數據庫中刪除元素。 編譯時,代碼拋出以下錯誤:
未捕獲的類型錯誤:無法讀取未定義的屬性(讀取“indexOf”)
這是我的jsx:
{(zakazani.map((termin, key) => (
<tr key={key+1} className="border-t-2 border-b-2 py-4 bg-slate-100 border-slate-200">
<td className="pl-4 border-r-2 border-slate-200">{key+1}</td>
<td className="pl-4 border-r-2 border-slate-200">{termin.name}</td>
<td className="pl-4 border-r-2 border-slate-200">{termin.phone}</td>
{(termin.time >= 1000) ? (
<td className="pl-4 border-r-2 border-slate-200">
{Math.floor(termin.time / 100)}:{termin.time % 100} - {((termin.time % 100 >= 15) ? Math.floor(termin.time / 100) + 1 : Math.floor(termin.time / 100))}:{(termin.time % 100 + 45) % 60}
</td>
) : (
<td className="pl-4 border-r-2 border-slate-200">
{Math.floor(termin.time / 100)}:{termin.time % 100} - {((termin.time % 100 >= 15) ? Math.floor(termin.time / 100) + 1 : Math.floor(termin.time / 100))}:{(termin.time % 100 + 45) % 60}
</td>
)}
<td className="pl-2">
<button
onDoubleClick={deleteOne(termin.time, termin.id)}
className="text-white bg-sky-600 w-10 h-10 flex justify-center px-1 pt-3 rounded-sm mt-2 mb-1 shadow-sm shadow-sky-200"><FaTrash /></button>
</td>
</tr>
)))}
這是我的 deleteOne function:
const deleteOne = (time, uid) => {
const ref = doc(db, 'zakazeniTermini', uid)
const ref2 = doc(db, 'termini', time.toString())
deleteOne(ref)
updateDoc(ref2, {
slobodniKreveti: increment(1)
})
const newArray = zakazani.filter(termin => termin.id !== uid)
setZakazani(newArray)
}
編輯:我在 function 中得到兩個參數的錯誤。
提前感謝您的幫助:)
這意味着您將null
(或undefined
)傳遞給某處的doc
調用。 很可能是您的uid
變量是null
,但是您應該在使用之前檢查所有變量:
const deleteOne = (time, uid) => {
if (!uid) throw `deleteOne requires a uid value, but you passed '${uid}'.`
if (!time || !time.toString) throw `deleteOne requires a time value that implements toString(), but you passed '${time}'.`
...
}
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.