네브바 컴포넌트를 모두 호출하되, 내부에서 미디어 쿼리를 이용하여 하나만 보이게 할 수 있을거같음.
return (
데스크탑네브바
태블릿네브바
모바일네브바
)
각각의 네브바안에서 미디어쿼리가 있어서 하나만 보이는거지
아니면 resize이벤트에 핸들러를 추가시키고 이 핸들러안에서
현재 사이즈가 데스크탑인지 태블릿인지 모바일인지 확인하는 변수를 만들고, 이 변수로 컴포넌트를 부르는거지
...
window.addEventlistener('resize', () => {
window.innerWidth를 감지하여 isMobile같은 변수를 설정
})
return (
{is Mobile? 모바일컴포넌트 : 데스크톱컴포넌트}
)
어떤 방식을 선호함?
첫번째는 어찌되었든 dom에 영향을 주지만 cssom이랑 합쳐져 rendertree에는 영향안주고
두번째는 첫번째보다 좀 살짝 복잡해진느낌인데 명시적으로 하나만 호출하고
댓글 0