SPA에서 QR 코드를 생성합니다.
개요
「QR코드를 갖고 싶어…
그물을 살펴보면 텍스트 입력, 크기 입력,
만들기 버튼 포치에서 QR 코드 돈, 광고 워서 와서
같은 사이트가 여러가지 걸리지요. (편견)
그래서 SPA에서 실시간으로 QR 코드가 다시 쓰여지면 재미있을까,
라고 생각해 만들어 보았습니다.
만든 것
실시간 QR 코드 생성기
사용한 기술
실시간 QR 코드 생성기
사용한 기술
코드
여기 에 있습니다.
싹둑 포인트만 발췌합니다.
Material-UI에서 CSS-in-JS
CSS 클래스는 makeStyles , createStyles 로 정의할 수 있습니다.
이렇게 하면 CSS 파일이 필요하지 않습니다.
import { makeStyles, createStyles } from '@material-ui/styles';
const useStyles = makeStyles(() =>
createStyles({
app: {
display: 'flex',
flexWrap: 'wrap'
},
appBar: {
marginBottom: '10px'
}
})
);
const App: React.FC = () => {
const classes = useStyles();
return (
<div className={classes.app}>
<AppBar position={'static'} color={'default'} className={classes.appBar}>
<Toolbar>
<Typography variant={'h6'} color={'inherit'}>
Realtime QR Code Generator
</Typography>
</Toolbar>
</AppBar>
</div>
);
};
export default App;
QR 코드 사양
import { makeStyles, createStyles } from '@material-ui/styles';
const useStyles = makeStyles(() =>
createStyles({
app: {
display: 'flex',
flexWrap: 'wrap'
},
appBar: {
marginBottom: '10px'
}
})
);
const App: React.FC = () => {
const classes = useStyles();
return (
<div className={classes.app}>
<AppBar position={'static'} color={'default'} className={classes.appBar}>
<Toolbar>
<Typography variant={'h6'} color={'inherit'}>
Realtime QR Code Generator
</Typography>
</Toolbar>
</AppBar>
</div>
);
};
export default App;
Google Chart API 사양을 준수합니다.
요약
Reference
이 문제에 관하여(SPA에서 QR 코드를 생성합니다.), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://qiita.com/obuchi3/items/e7235b4f6e831ba735fd텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
우수한 개발자 콘텐츠 발견에 전념
(Collection and Share based on the CC Protocol.)
좋은 웹페이지 즐겨찾기
