![[React] 리엑트 반응형(useMediaQuery)](https://blogimgs.pstatic.net/nblog/mylog/post/og_default_image_160610.png)
npm install npm i react-responsive ----- yarn add react-responsive useMediaQuery 아래와 같이 크기를 감지하여 "모바일", "PC"를 구분할 수 있고 실시간으로 "넓이", "높이" 값을 가져올 수 있다. import React from "react" import { useMediaQuery } from "react-responsive"; const Home = () => { const isResponsive = useMediaQuery({ query: '(max-width: 424px)' }); return (
{isResponsive && ( 모바일 일때 )} {!
isResponsive && ( PC 일때 )} ); }; export default Home;...
isResponsive && ( PC 일때 )} ); }; export default Home;...
#
media
#
mediaquery
#
pc
#
query
#
react
#
리엑트
#
모바일
#
반응형
원문 링크 : [React] 리엑트 반응형(useMediaQuery)
![[CentOS7] phpMyAdmin 최신버젼 설치](https://mblogthumb-phinf.pstatic.net/MjAyMDAzMjBfMTIg/MDAxNTg0NzA3NTExMDI4.gstQ6kMzZqbzscbGOohWVq-4qeKAGV8L4q-8uaXPmNsg.ody7D8Id_NUn2qVvpTYqIE4tLndMRqYPIDBvFIuUKlMg.PNG.phongdaegi/PhpMyAdmin-Allow-Access.png?type=w2)
![[Windows10] 우분투(Ubuntu) 아이오닉(ionic) 설치 부터 APK 빌드하기](https://mblogthumb-phinf.pstatic.net/MjAyMDA3MTFfMTA0/MDAxNTk0NDMyOTI4MzA5.obv431fZJ-dhb_fjXEbXPXEcdATQoC7NBdlOFPv70qkg.FJ_JfmalN9MT3AeRF6taZR4XTNyPZAdg3jv6pseWvusg.PNG.phongdaegi/image.png?type=w2)