/
galiaf
/
qr-code
Обзор
Документация
Войти
/
galiaf
/
qr-code
Код
Запросы
0
Задачи
Пакеты
0
Релизы
0
Аналитика
Безопасность
master
src/components/Generate/QrCodeGenerator.jsx
53 строки
1 KB
GaliaF
init
20 июл 2024, 10:00
20 июл 2024, 10:00
d658a27
Код
Авторство
О чём код?
import { useState } from 'react'; import {QRCodeSVG} from 'qrcode.react'; import { GENERATE_DATA } from '../../constans' import s from './qrCodeGenerator.module.css'; const QrCodeGenerator = () => { const [value, setValue] = useState(''); const [result, setResult] = useState(''); const onClickHandler = () => { const prevData = JSON.parse(localStorage.getItem(GENERATE_DATA) || '[]'); localStorage.setItem( GENERATE_DATA, JSON.stringify([...prevData, value]) ); setResult(value); setValue(''); }; const onChangekHandler = (event) => { setValue(event.target.value); setResult(''); }; console.log(result); return ( <div className={s.container}> <input type="text" value={value} placeholder="Введите текст..." onChange={onChangekHandler} className={s.input} /> <button type="button" className={s.button} onClick={onClickHandler}> Сгенерировать QR </button> {result !== '' && ( <div className={s.qrWrapper}> <QRCodeSVG value={result} size={200} /> </div> )} </div> ); }; export { QrCodeGenerator };