오늘의 TIL
withRouter
withRouter로 라우터 내의 라우터를 제어할 수 있다.
withRouter로 컴포넌트 전체를 감싸, Route를 지정해주면 링크가 이동한다.
hover
마우스 오버 했을 때를 의미
Youtube player
https://www.npmjs.com/package/react-player
Grid & 가로 스크롤
https://uxdesign.cc/creating-horizontal-scrolling-containers-the-right-way-css-grid-c256f64fc585
리듀서
상태를 변화시키는 로직이 있는 함수
예제 코드
(...)
const initialState = {
number: 1,
foo: 'bar',
baz: 'qux'
};
function counter(state = initialState, action) {
switch (action.type) {
case INCREMENT:
return Object.assign({}, state, {
number: state.number + action.diff
});
case DECREMENT:
return Object.assign({}, state, {
number: state.number - action.diff
});
default:
return state;
}
}=> Object.assign 대신 ES6 문법의 전개 연산자(…)를 사용하면 더욱 깔끔하게 코드를 입력할 수 있습니다.
function counter(state = initialState, action) {
switch(action.type) {
case INCREMENT:
return {
...state,
number: state.number + action.diff
};
case DECREMENT:
return {
...state,
number: state.number - action.diff
};
default:
return state;
}
}