react 오늘 한것 정리(redux store 저장, redux구조,redux action)

react 생명주기 will render did순서

didmount가 한번돈다고해도 interval로 안에서 통신은 반복됨.

- smartchecker 의 트리를 봤을때

 action 및 설정들

• container들의 랜더링 및 돌아가도록할때 src/pages에서 추가해준다.
• action에 대한 api는 src/lib
• src/store/moudle/index 에서 export 서비스를 설정해준다. - store에 값을 저장하고 확인안될경우    ex) improt * as ~Action 할때 쓰인다.

store 저장할때 예시

HeaderTimeContainer를 예로 들면

import들은 각각에 따라 찾아 넣으면 되고, url도 잘 지정해준다.

import React, { Component } from "react";

import { connect } from "react-redux";

import { bindActionCreators } from "redux";

import HeaderView from 'components/Header/HeaderView';

import * as commuteActions from "store/modules/commute";

import * as timeActions from "store/modules/time";

import * as headerActions from 'store/modules/Header';

이정도 필요하다고 보고

1. 먼저 store에 저장할 값을 정한다.
2. 위의 action 및 설정들에서 미리 설정들을 해준뒤
3. HeaderActions.changeInput({name:'timeset', value:timeset});

4. changeInput은 미리 reducer에서 만들어 놓자. - action까지 다 만들어 놓아야되고, 그 외 action 설정도 해야 가능 console를 찍어가며 확인

5. export default connect(

state => ({

timeset : state.header.get("timeset")

}),

dispatch => ({

HeaderActions: bindActionCreators(headerActions, dispatch)

})

)(HeaderTimeContainer);

이런식으로 값을 넣어준다. - store 저장 완료

6. 갔다 쓸때는 마찬가지로 import하고 state에 적어주고 dispatch에 action 넣어주면된다.

진짜로 나만 알아보게 적다.

프로젝트 마무리후 정리하기-제발