Empresas
Empregos
  • Sobre nós
  • Soluções
    • Publicação de vagas
      Publique sua vaga e receba candidatos qualificados em 48h.
    • Avaliações de candidatos
      Mais de 500 testes técnicos e psicológicos, mais anti-fraude.
    • Headhunting
      Busca executiva personalizada do início ao fim.
    • Folha de Pagamento + EOR
      Dispersão de folha e EOR em mais de 15 países da LATAM.
  • Preços
  • Empregos

0

325
Visualizações
¿Cómo puedo copiar un texto con el botón ReactJS?

Hola, tengo una matriz y quiero copiar texto en el elemento p ({item.adress}=> es un elemento de matriz) cuando hago clic en el botón. ¿Puedes ayudarme?

 import classes from './CryptoBox.module.css' const CryptoBox = (props) => { let item = props.item return( <div className={classes.box}> {item.map(item => ( <div className={classes.boxx} key={Math.random().toString(36).slice(2)}> <img src={item.img} alt={item.id}/><br/> <p id={item.adress} hidden>{item.adress}</p> <span> <button onClick={}> {props.link} </button> </span> </div> ))} </div> ) } export default CryptoBox;
about 4 years ago · Juan Pablo Isaza
3 Respostas
Responde à pergunta

0

Inspirado por esta respuesta, pero probablemente haya formas de optimizar. Si desea copiar al portapapeles:

 const CryptoBox = (props) => { let item = props.item; const copyValue = (val) => { // Create a "hidden" input var aux = document.createElement("input"); // Assign it the value of the specified element aux.setAttribute("value", val); // Append it to the body document.body.appendChild(aux); // Highlight its content aux.select(); // Copy the highlighted text document.execCommand("copy"); // Remove it from the body document.body.removeChild(aux); }; return( <div className={classes.box}> {item.map(item => ( <div className={classes.boxx} key={Math.random().toString(36).slice(2)}> <img src={item.img} alt={item.id}/><br/> <p id={item.adress} hidden>{item.adress}</p> <button onClick={() => copyValue(item.adress)}> {props.link} </button> </div> ))} </div> ) } export default CryptoBox;
about 4 years ago · Juan Pablo Isaza Relatório

0

¿Necesitas las etiquetas p? porque si quieres copiar al portapapeles solo tienes que hacer algo como esto en tu boton

 <button onClick={() => navigator.clipboard.writeText(item.adress)}> {item.link} </button>

Las etiquetas p no son necesarias para copiar en el portapapeles porque en realidad tiene el valor de item.address cuando está mapeando para que pueda pasar eso en lugar de buscar a través del dom para encontrar la etiqueta p que está oculta para el usuario.

about 4 years ago · Juan Pablo Isaza Relatório

0

Como espero que desee que el párrafo se oculte según su código, puede usar "console.log" dentro de su función onClick para generar la dirección del elemento del elemento en el que hizo clic. Como abajo:

 <button onClick={console.log()}> {props.link} </button>
about 4 years ago · Juan Pablo Isaza Relatório
Responde à pergunta
Encontrar trabalhos remotos

Descubra a nova forma de encontrar um emprego!

melhores empregos
Principais categorias de trabalho
Empresas
Postar vaga Preços Comercial
Jurídico
Termos e Condições Política de privacidade
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomende algumas ofertas para mim
Preciso de ajuda