본문 바로가기

개발(라이브러리,프레임워크)/react.js & react native32

라이프사이클 Life Cycle props / state에서 re render 되지 않게 조절 할 수 있음 CompenetWillReceiveProps props를 새로 지정했을 때 바로 호출됨 state변경에는 반응x props값에따라 stat변경을 원하면 setState를 이용해 state를 변경한다. 다음이벤트로 가는것이 아니라 한번에 변경됨 shouldComponentUpdate props만 변경되어도 state만 변경되어도 props & state 둘다 변경되어도 newProps와 new State를 인자로 해서 호출 return type 이 boolean 임 ture 면 render false 면 render가 호출 x 디폴트는 true compoentWillUpdate 컴포넌트 재 랜더링 되기 직전에 불.. 2021. 9. 23.
props 와 state props 와 state props 컴포넌트 외부에서 컴포넌트에게 주는데이터 State 컴포넌트 내부에서 변경 할 수 있는 데이터 둘다 변경이 발생하면 랜더가 다시 일어날 수 있음 render 함수 props 와 state를 바탕으로 컴포넌트를 그린다. 그리고 props 와 state가 변경되면, 컴포넌트를 다시 그린다. 컴포넌트를 그리는 방법을 기술하는 함수가 랜더함수이다. props 예시 function //props >> {message: "하이하이"} 로 들어옴 function Component(props) { return ( {props.message} 함수로만든컴포넌트 ); } ReactDOM.render( , document.querySelector("#root")) class class C.. 2021. 9. 23.
Firebase 연동 firebase연동 설치 react-native-firebase 패키지에서 제공하는 react-native-firebase/auth react-native-firebase/firestore react-native-firebase/storage 등을 사용하려면 react-native-firebase/app 모듈 설치가 되어있어야한다. # Using npm npm install --save @react-native-firebase/app firebase ​ 안드로이드 설정 firebase 콘솔에서 android 앱 추가 firebase console > project settings > General > Your apps > 안드로이드 아이콘 클릭 packagename 입력(android/app/src/ma.. 2021. 7. 1.
axios / fetch axios 공공데이터 활용 npm install axios import axios from "axios"; 예시 getWeather = async(areaCode) => { const { data } = await axios.get( `http://openapi.seoul.go.kr:8088/${API_KEY}/xml/ListAirQualityByDis trictService/1/5/${areaCode}/` ); console.log(data); } getWather = async (areaCode) => { const { data } = await axios.get( `http://openapi.seoul.go.kr:8088/${API_KEY}/xml/AreaQltwtrSttus/1/5/${areaCo.. 2021. 6. 30.
반응형