본문 바로가기
728x90

Front_end/React13

React) 렌더링이 2번 되는 현상 렌더링이 2번 발생한다 react로 개발하던 중 콘솔이 2번씩 찍히는 것을 발견했다 결론부터 말하자면 버그가 아니라 정상이다 리액트 개발 모드에서는 2번씩 렌더링 되지만 배포 후에는 코드 대로 동작한다고 함 https://all-dev-kang.tistory.com/entry/%EB%A6%AC%EC%95%A1%ED%8A%B8-%EB%91%90%EB%B2%88-%EB%A0%8C%EB%8D%94%EB%A7%81-%EB%90%98%EB%8A%94-%EC%9D%B4%EC%8A%88%EC%97%90-%EB%8C%80%ED%95%98%EC%97%ACFeatStrictMode constructor 원인은 생성자 내부에서 비동기 호출을 할 수 없기 때문이라고 한다 두 번 렌더링 되는 것은 컴포넌트가 변경되어 리렌더 되.. 2022. 5. 9.
React) 컴포넌트 라이프 사이클 API 라이프 사이클 API 컴포넌트의 생명 주기와 함께하는..? API 7가지 라이프 사이클 API componentWillMount : 컴포넌트 렌더링 이전에 실행 componentDidMount : 컴포넌트 첫 렌더링 이후 -> 프레임워크 연동, setTimeout/AJAX 등 사용 가능 componentWillReceiveProps : 새로운 props를 받았을 때 -> props에 따라 state 업데이트 할 때 사용하면 유용 (setState 사용 가능) shouldCompoenetUpdate : 컴포넌트가 업데이트를 해야하는지 말아야하는지 결정하는 -> return false 설정 시 불필요한 작업을 막을 수 있다 componentWillUpdate : 컴포넌트 업데이트 전 실행 -> setStat.. 2022. 5. 3.
React) 이미지 넣기 src 하위의 컴포넌트에서 이미지를 넣을 때 경로는 public 기준으로 상대 경로가 설정되어있음 2022. 4. 27.
React) styled-component 사용 시 주의 사항 1. 컴포넌트가 렌더링 될 때 마다 css 코드를 함께 불러오기 때문에 자주 재 렌더링 되는 곳에는 사용을 피해야 한다 2. css 파일에 와일드 카드 (*) 를 사용 시 스타일 컴포넌트가 안먹고 화면에 스타일 컴포넌트의 css코드가 나오는 경우 발생 2022. 4. 25.
728x90