Conditional rendering in a single map Component

Asked

Viewed 13 times

-1

to with a little problem here, to fzd a map of some data and wanted to put a conditional rendering on each, when the delete or Edit button was pressed, but when I click on the button of a map item it renders to

I would like to press a button on a specific map item that I would like to delete, and so would be rendered a div with a sentence a commit button so that the item would be deleted, but when I click on the button of an item that I want to remove from the map, confirmation rendering appears for all items.

        {dados.map(dados => (
      <ReportContent key={dados.id}>
        <div className="launchContent">
          <div>
            <p>Empresa: {dados.empresa_nome}</p>
            <p>Valor: {dados.valor}</p>
            <p>Tipo de pagamento: {dados.tipoPagamento_descricao}</p>
          </div>
          <div className="content_bttn">
            <div>
              <button onClick={() => (handleOpenNewLaunchModal(dados.id))}>
                <AiFillEdit />
              </button>
              <p>Editar</p>
            </div>
            <div >
              <button onClick={() => (openDeleteLaunch(dados.id))}>
                <AiFillDelete />
              </button>
              <p>Deletar</p>
            </div>
          </div>
        </div>
        {deleteLaunchContent && (
          <div className="deleteContent">
            <h3>
              Você deseja excluir essa venda de passagem ?
            </h3>
            <div>
              <button className="btnDeleteYes">
                Sim
              </button>
            </div>
          </div>
        )}
      </ReportContent>

    ))}
  • Please clarify your specific problem or provide Additional Details to Highlight Exactly what you need. As it’s Currently Written, it’s hard to Tell Exactly what you’re asking.

No answers

Browser other questions tagged

You are not signed in. Login or sign up in order to post.