Executando verificação de segurança...
1
TOMSENA97
1 min de leitura ·

atualização do meu primeiro site de qr code em react js

import {useState} from 'react';
import QRCode from 'react-qr-code'
import QRCodeLink from 'qrcode';
import './App.css';

function App() {
const [link, setLink] = useState('')
const [qrcodeLink, setQrcodeLink] = useState('')
const [open, setOpen] = useState(false)

function handleGenerate(link_url){
QRCodeLink.toDataURL(link_url,{
width:600,
margin:3,
}, function (err, url){
setQrcodeLink(url);
})
}

function handleQrcode(e){
setLink(e.target.value);
handleGenerate(e.target.value)
}

return (

  <QRCode
   value={link}
   />


 <input className="input"
 placeholder="digite seu link..."
 value={link}
 onChange={ (e) => handleQrcode(e)}
 />
 
 <a href={qrcodeLink} download={'wallp.png'}>Baixar QrCode</a>

 



</div>

);
}

export default App;

Carregando publicação patrocinada...
0
1
grrypsing

Seu questionamento é um pouco ambíguo, mas pelo que entendi você quer estilizar a tag de link utilizando um nome de classe. Faça da seguinte maneira:

  • Na tag 'a':

    <a className="nomeClasse" href={qrcodeLink} download={'wallp.png'}>Baixar QrCode

  • No arquivo ./App.css você faz a estilização.

  • Ou, crie um outro arquivo css e importe.

1