자바스크립트(javascript)

[react/javascript] 모바일 orientation (가로/세로) 상태 받아오기

개발자 고포고 2022. 11. 23. 23:43
반응형

[react/javascript] 모바일 orientation (가로/세로) 상태 받아오기

 

#사이트

https://www.npmjs.com/package/react-screen-orientation

 

react-screen-orientation

Display Components based on screen orientation. Latest version: 0.0.4, last published: 3 years ago. Start using react-screen-orientation in your project by running `npm i react-screen-orientation`. There is 1 other project in the npm registry using react-s

www.npmjs.com

 

#설치

npm install react-screen-orientation --save

 

#사용

<DeviceOrientation lockOrientation={'landscape'}>
        <Orientation orientation='landscape' alwaysRender={false}>
          <div>
            <h4>landscape</h4>
          </div>
        </Orientation>
        <Orientation orientation='portrait' alwaysRender={false}>
          <div>
          <h4>portrait</h4>
          </div>
        </Orientation>
      </DeviceOrientation>

 

#결과

 

#orientation #회전 #방향 #모바일 #react #screen #javascript #리액트

반응형
저작자표시