Age of Discovery

다음은 장바구니에 담겨 있는 선수들의 수량을 추가하거나 감소시키고 삭제하는 기능까지 구현해보자. ( 이번 포스팅은 꽤 길다 ) let players = createSlice({ name: "players", initialState: [ { id: 0, name: "Mohamed Salah", count: 1, }, { id: 1, name: "Sadio Mane", count: 1, }, ], }); 예시로 넣어놨던 Salah와 Mane는 빼주고 시작하자 let players = createSlice({ name : 'players', initialState : [ ], reducers : { } }) reducers: { } 가 생겼는데 이건 기존에 저장되어있는 initialState를 조작하는 함수를..

​ 이번에 프리미어리그 공동득점왕을 수상한 '살라'와 '손흥민'을 배열로 저장해 state로 조작해보겠다. let [Top_player, setplayer] = useState(['살라', '손흥민']); 버튼을 만든 후 { let copy = [...Top_player] copy[0] = copy[1] setplayer(copy) }}>눌러봐 버튼 속성으로 onClick속성을 넣고 화살표 함수안에 지역변수로 배열을 새로 복사해준다 ​ 기존의 배열을 그대로 사용하지않고 따로 복사하는 습관을 들이는게 좋다 원본을 해치지 않기 때문 ​ 그리고 let copy = [...Top_player] 여기서 [... a] 은 스프레드 연산자로 쉽게 메모리의 주소값을 복사하는게 아니라 새로운 값을 복사해줄 수 있기 때문..

그 동안 JS 변수 var, let, const에 대해서만 배웠었는데 리액트에서 쓰는 State라는 변수를 알아보자 ​ let title_1 = 'YNWA'; {title_1} 이렇게 사용하던 변수를 let [title_1, b] = useState('YNWA') {title_1} 이렇게도 사용할 수 있다. ​ 왜 굳이 더 길게 써야하느냐? 변수가 변경됐을 때 새로고침없이 재렌더링이 가능하기 때문이다. ​ ​ 기존 변수를 사용했을 경우엔 새로고침을 해야 유저가 변하는 부분을 확인할 수 있지만 State를 사용했을 시 변수가 변경돼도 홈페이지를 리로드하지않고 바로 변화시킬 수 있다 ​ 사실상 react를 사용하는 핵심이유라고 생각한다. ​ 또한 let [TeamName, a] = useState(['LIV..