어떻게 해서 기본 값을 줄건지, 수정한 부분만 변경이 된다면 좋을텐데...!
- placeholder → 이렇게 입력하시면 됩니다 라는 예시를 보여주는 것
- value → 등록된 값 (고정 값, 입력 못함)
- defaultValue 로 출력 → 내가 입력한 값이 없을 때 보여주는 것 (초기 값, 수정가능)
그러면 기존에 있는 값을 가져와야 하니까 fetchBoard를 컨테이너에서 하면 괜찮나?? -> ❌
→ 등록하기 페이지에도 갈텐데, 등록하기에선 fetch할 수 없다
💡게시글 수정 페이지에서 fetchBoard하고 props로 내려주기
- 등록하기에서는 Data를 받아오지 못하니까, 데이터가 비어있고 수정하기 페이지에서는 props로 데이터를 받아오고 있으니까 데이터가 남아있다
→ 제목만 수정이 되고, 작성자랑 내용은 비워짐
→ defaultValue가 남아있는 상태에서 그냥 수정하기를 누르면 다 지워져서 나옴
→ OnClickUpdate에 있는 state는 빈 문자열이 있는 것!해결방법
- 모든 state에 (시작하자마자) 초기 값으로 defaultValue를 넣어주기 (비효율적)
- mutation을 보낼 때, state가 채워져 있는 것만 보내기 (이거쓰기)
Interface의 'I'와 변수명을 합쳐주는 것
ex) 객체를 담은 변수 이름 : profile
타입을 지정하는 객체 : IProfile로 네이밍해주기 (관례)
package.json
- JSX 를 return 하는 컴포넌트 : tsx (index.tsx)
- 자바스크립트만사용하는 컴포넌트 : ts (index.ts)
타입추론
변수에 타입을 먼저 입히지 않고 할당 → 처음에 들어간 값으로 자동 지정
let aaa = "안녕하세요" // string
타입명시
let bbb: string = "반갑습니다"
문자타입
let ccc: string` `ccc: 반가워요!
숫자타입
let ddd: number = 10
불린타입
let eee: boolean = true
eee = false
배열타입
let hhh: (string | number)[] = ["철수", "영희", "훈이", 10]
객체타입
interface IProfile {
name: string
age: number | string
school : string
}
const profile: IProfile = {
name: "철수",
age: 8,
school: "다람쥐초등학교",
};
profile.name = "영희"
profile.age = "8살"
함수타입
const add = (num1 : number, num2 : number, unit: string): string=> {
return num1 + num2 + unit
}
const result = add(1, 2, "원") // 결과의 타입도 예측 가능
애니타입(쓰지말기)
//애니 타입 (쓰지말기)
let qqq: any = "철수" //js와 동일
qqq = 123
qqq = true