akjfal

var 글로벌 const let 은 블럭스코프 한정자 settimeout은 js자체의 스펙이아니다 범위 밖이다 실행전과 실행후 state가 완전히 같다 새로운 친구를 만들어야한다 ...state list: [...state.list, action.payload] redux자체가 얕은 비교만 한다. maptoprops를 하게되면 state가 바뀌었다고 생각하면 전부다 호출한다 hook자체도 렌더링을 시도할때마다 다시안하려고 일종의 기법 rendering을 다시 일으키는 경우 렌더링 trigger props변경 : 입력이 바뀐경우 redux : props바꿔주는 애들(state2props, dispatch2props) hook : state(setA) useEffect(()=>{}) -> 렌더링을 트리거하는..

함수의 관심사 - 해야할일 순수함수 - 외부의 무엇인가를 변경해서는 안된다 입력이 같으면 경과가 같다 - 외부의 영향을 받지안는다 callback 나주엥 호출되는얘 - callback을 지정해 외부에서 작동하도록 한것이다 출력ui 버튼에서 출력 -버튼을 만드는것 입력 - props 함수형으로 호출시 내부적으로 데이터를 알고 싶을때 만들어진것이 hook useState 어딘가에 이 함수만을 위한 공간을 만들겠다 저장되어있던 스테이트를 바꾸고 화면에 그려진부분을 다시그리기 위해서 함수자체를 다시 호출한다 일부분만 갱신하기 위해 다시 호출한다 const MyButton = (props-입력) => { 출력 = return { alert('pressed'); }}/> MyButton을 여러개 사용해도 서로 새로..

나중에 다시한번 꼭 읽어보기! https://rinae.dev/posts/a-complete-guide-to-useeffect-ko https://overreacted.io/ko/react-as-a-ui-runtime/ https://overreacted.io/how-are-function-components-different-from-classes/ https://www.robinwieruch.de/react-hooks-fetch-data/ ​

const handleBackground = (background) => { switch (background) { case 'aaa': backgroundcolor: ${({ backgroundcolor }) => handleBackground(background)}; {children} 스타일 지정법 const { getRootProps, getInputProps } = useDropzone({ accept: 'image/*', onDrop: (acceptedFiles) => { setFiles(acceptedFiles.map((file) => Object.assign(file, { preview: URL.createObjectURL(file), }))); setNewRepresentImg(accep..

https://ko.reactjs.org/docs/hooks-rules.html Hook의 규칙 – React A JavaScript library for building user interfaces ko.reactjs.org * 공식 문서를 정리한 글입니다. 1. 최상위(at the Top Level)에서만 Hook을 호출해야 한다. 예시) import React, { useEffect } from 'react'; import './App.css'; function App() { function aa(){ console.log('dd') const [count, setCount] = React.useState(0); } return ( ); } export default App; 결과 : 2. 오직 R..

redux에 save를 줘서 true일때와 false일때를 바꿔준다. use를 하위에서 사용하고 상위에서 또 사용시 dependency가 나옴 -> 아니네..? 그럼 어디지? onclick => onclick으로 넘겨버리면 된다!! 양쪽으로 왓다갓다가 실행이 제대로? const store = useContext(StoreContext); const tempdata = store.getState(); useEffect(() => { setData({ name: tempdata.productname, explain: tempdata.productexplain }); }, [tempdata]); 이렇게 해버리기!!! redux에 개별 저장해놓는 변수와 이것을 배열로 든 오브젝트든 묶어주는 변수가 있으면 좋을 ..

여러 옵션이 추가적으로 늘어난다 이것들의 데이터가 추가된다 순서대로 추가될시 왓다갓다하며 적었을때 순서가 섞일 수 가 있다. 각자 고유 배열의 값에 데이터가 들어가야만 한다 그렇다면 하나의 세트로 들어가는 것이 좋지안을까? 그냥 첫째 배열 - 몇번째 2째 이름인지 뭔지 넣고했다 tempdimenstion: { [action.dimension1]: { [action.dimension2]: action.optionName }, }, ...state, tempdimension: state.tempdimension.concat({ [action.dimension1]: { [action.dimension2]: action.optionName }, }), }; 이건 오류가 없고 ...state, tempdimens..

https://dev-momo.tistory.com/entry/React-Hooks why hook 거대하고 복잡한 component해결 : useState를 통해 state를 재사용하고 비교적 덜 무거운 함수형 컴포넌트에 state사용 중복 로직 : component~를 useEffect를 통해 대체 this 미사용 CRUD : create read update delete https://velog.io/@killi8n/4-2.-React-%ED%8E%98%EC%9D%B4%EC%A7%80-%EA%B5%AC%EC%A1%B0-%EC%83%9D%EC%84%B1.-2tjmc31cra http://jeonghwan-kim.github.io/2018/07/16/react-app-overview.html 리덕스의 ..