第七色在线视频,2021少妇久久久久久久久久,亚洲欧洲精品成人久久av18,亚洲国产精品特色大片观看完整版,孙宇晨将参加特朗普的晚宴

為了賬號安全,請及時(shí)綁定郵箱和手機(jī)立即綁定
已解決430363個(gè)問題,去搜搜看,總會有你想問的

從對象數(shù)組 Reactjs 中刪除特定項(xiàng)目

從對象數(shù)組 Reactjs 中刪除特定項(xiàng)目

蝴蝶刀刀 2023-06-15 16:25:56
大家好我正在使用 React 和 materialUI 構(gòu)建一個(gè)克隆服務(wù)臺系統(tǒng)當(dāng)用戶單擊它時(shí),我遇到了從對象數(shù)組中刪除特定項(xiàng)目的問題。我曾嘗試使用 updatedRow.splice(index,1) 但這只是刪除添加到數(shù)組中的最后一個(gè)對象而不是特定對象。我試圖根據(jù) ticketID 屬性刪除它 我嘗試使用數(shù)組方法 indexof 來控制臺記錄對象的特定索引,但它只返回 -1,這意味著該項(xiàng)目在屏幕上顯示時(shí)不在數(shù)組中。該函數(shù)應(yīng)該根據(jù)條件是否為真來過濾并僅保留未被選中的項(xiàng)目,并刪除為真的項(xiàng)目,然后應(yīng)該調(diào)用 Setrows 來更新屏幕上的內(nèi)容。有人可以在這里準(zhǔn)確解釋我做錯(cuò)了什么,請參閱下面的代碼... /// original array to populated with data  let row = []; const [rows, setRows] = useState(row); const formDataHandler = ({ desc, option }) => { const data = { description: desc, priority: option, lastUpdate: Date.now(), ticketID:shortid.generate() };setRows([...rows, data]);console.log(rows);};/// delete row function  const removeTicket = (index)=> { let updatedRow = rows;// updatedRow.splice(index,1)console.log(updatedRow.filter(index => ticketID !== index.id? ))setRows([...updatedRow])/// returned         <Container maxWidth="md">  <Grid>    <TableContainer component={Paper}>      <Table className={classes.table} aria-label="simple table">        <TableHead>          <TableRow>            <TableCell>Description</TableCell>            <TableCell>Priority</TableCell>            <TableCell>Last update</TableCell>            <TableCell>Ticket ID</TableCell>          </TableRow>        </TableHead>        <TableBody>          {rows.length>0?rows.map((row) => (            <TableRow key={row.ticketID}>              <TableCell component="th" scope="row">                {row.description}              </TableCell>              <TableCell>{row.priority}</TableCell>              <TableCell>{row.lastUpdate}</TableCell>              <TableCell>{row.ticketID}</TableCell>              <TableCell>                <IconButton onClick={removeTicket} aria-label="delete" color="primary">                  <DeleteIcon />                </IconButton>              </TableCell>            </TableRow>          )):null}        </TableBody>      </Table>    </TableContainer>  </Grid>  <FormDialog formData={formDataHandler} />  {JSON.stringify(rows)}</Container>);}
查看完整描述

1 回答

?
MMTTMM

TA貢獻(xiàn)1869條經(jīng)驗(yàn) 獲得超4個(gè)贊

您需要將 傳遞ticketID給您的處理IconButton程序onClick:


<IconButton 

  onClick={() => removeTicket(row.ticketID)} 

  aria-label="delete" 

  color="primary"

>

  <DeleteIcon />

</IconButton>

并更新您的處理程序,您可以在其中使用以下方法創(chuàng)建一個(gè)新數(shù)組.filter():


const removeTicket = (ticketID)=> {

  setRows(rows.filter(item => ticketID !== item.ticketID)

}

這將返回與您傳遞的不同的rows.filter()每個(gè)元素。ticketID


查看完整回答
反對 回復(fù) 2023-06-15
  • 1 回答
  • 0 關(guān)注
  • 182 瀏覽
慕課專欄
更多

添加回答

舉報(bào)

0/150
提交
取消
微信客服

購課補(bǔ)貼
聯(lián)系客服咨詢優(yōu)惠詳情

幫助反饋 APP下載

慕課網(wǎng)APP
您的移動學(xué)習(xí)伙伴

公眾號

掃描二維碼
關(guān)注慕課網(wǎng)微信公眾號