1. json obj 이용 세팅
setCount(prev => prev + 1) 처럼 json이용해서 사용하려면
setUser (prev => { ...prev, name:'kim'} ) 하면 안된다. 이유는 { 를 함수시작으로 인식하기 때문이며, 해결 법은 2가지인데
setUser(prev => ({...prev, name:'kim'}) ) 괄호이용 , usetUser (prev => { return {prev..., name:'kim'} }) return 이용.
2. handleChange 에서 e.target.name 이용
const handleChange = e => {
setUser( {...user,
[e.target.name]: e.target.value} ). 이렇게 중괄호(curly brace)를 이용하면 변수를 이용해 필드설정 가능
} => 여러개 의 input text 를 하나의 handleChange로 이용하게 된다.
3. 페이지 reload 하는 경우
const TestApp = () => {
console.log("reloaded"); // setQuantity(0) 호출시 안찍힘. setQuantity(1) 호출시 찍힘. 즉 state가 바뀔때만 reload
// json obj는 같은 {age:1} 대신 {age:1} 형태로 같은 내용이라도 pointer가 항상 바뀌므로 찍힘.
const [quantity, setQuantity] = useState(0)
const totalPrice = quantity * 5; // useState 필요없이 이 방식대로 해도 page가 reload 될 때마다 재계산된다.
}
4. api호출 취소
axios는 cancelToken 이용
fetch는 AbortController 의 controller.signal 이용해서 취소
