簡體   English   中英

無法從反應中 html 的迭代部分調用 function

[英]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.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM