유튜브: https://www.youtube.com/watch?v=ZaHOBXQ1I_c
깃허브:https://github.com/qjawns0222/caremaker/tree/next+ts10%EC%9D%BC%EC%B0%A8
오늘은 redux를 적용해봤습니다.
store/reduxer/data
import { ActionProps, CounterState } from "../types/state";
const initialState: CounterState = {
data: [
{
idx: "1",
currentform: "first",
maker: "admin",
text: {
title: "노래방",
date: "2022.04.17",
time: "12.14",
address: "경북 구미시",
content: "노래방 ㄱㄱ",
tags: "[놀자,놀자,놀자]",
},
},
],
common: {
login: "",
},
};
const main = (state = initialState, action: ActionProps) => {
switch (action.type) {
case "increase":
return { ...state, login: "admin" };
default:
return state;
}
};
export default main;
기본 저장된 데이터 설정하고 increase가 들어오면 login이 admin으로 변하도록 설정해봤습니다.
이렇게 해서 combinereducer와 리턴 타입을 만들어줬습니다.
미들웨어 자동으로 추가해주는 거와 개발환경일때 툴이용하개 해주는 함수를 만들어줬습니다.
그리고 next는 redux가 시행할때마다 다시생성 된다고 글을봤는데 그거때문에 wrapper을써준다고합니다.
그냥 바로 store넣어줘도 되긴하느데 저렇게 구분하도록 함수를 썼습니다.
다으므에는 저기 빨간줄뜨는걸 지워보고 가능하다면 initialstate를 api통해서 받아오는게 되는지 해보겠습니다.
'next+ts' 카테고리의 다른 글
next+ts12일차 ref공부 데이터 삽입 (0) | 2022.04.24 |
---|---|
next+ts 11일차 redux 에러수정 (0) | 2022.04.23 |
next+ts9일차 json성공 및 redux (0) | 2022.04.21 |
next+ts 8일차 json파일 _app.tsx (0) | 2022.04.20 |
next+ts 7일차 json파일 읽어오기 (0) | 2022.04.19 |