无法在react中从html的迭代部分调用函数

Question

我有一段代码，其中我在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函数：

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)
}

编辑：我得到函数中两个参数的错误。

提前感谢您的帮助：(

Answer 1

这意味着您正在将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}'.` 
...
}