ReactJS : 응용 프로그램이 모바일 또는 데스크톱 브라우저에서 표시되는지 확인하는 방법

Question

ReactJS에서 웹 사이트가 모바일 또는 데스크톱에서 표시되는지 확인하는 방법이 있습니까? 왜냐하면 어떤 장치에 따라 다른 것을 렌더링하고 싶기 때문입니다.

는

Answer 1

이 작업을 수행하지 않는 반작용, 반작용은 MVC 만보기 감사합니다. 결정 논리 (무엇을보아야하는지 제어)는 컨트롤러의 역할입니다. React는 컨트롤러를 구현하지 않지만 나머지 응용 프로그램에서 수행해야한다고 생각하므로 React 구성 요소의 컨텍스트를 제어하는 ​​다른 코드를 추가하거나 다른 장치에 다른 구성 요소를 사용하는 코드를 추가해야합니다.

Answer 2

찾고있는 것은 react-responsive입니다.

var MediaQuery = require('react-responsive'); 

var A = React.createClass({ 
    render: function(){ 
    return (
     <div> 
     <div>Device Test!</div> 

     <MediaQuery minDeviceWidth={1224}> 
      <div>You are a desktop or laptop</div> 
     </MediaQuery> 
     <MediaQuery maxDeviceWidth={1224}> 
      <div>You are a tablet or mobile phone</div> 
     </MediaQuery> 

     <MediaQuery orientation='portrait'> 
      <div>You are portrait</div> 
     </MediaQuery> 
     <MediaQuery orientation='landscape'> 
      <div>You are landscape</div> 
     </MediaQuery> 

     <MediaQuery minResolution='2dppx'> 
      <div>You are retina</div> 
     </MediaQuery> 
     </div> 
    ); 
    } 
});