fetch('λ°μ΄ν°λ₯Ό μ
λ°μ΄νΈν endpoint/id',{
method: 'PUT',
headers: {
'Content-Type': 'application/json'
},
body : JSON.stringify({
μ
λ°μ΄νΈν λ°μ΄ν° ν€ : λ°μ΄ν° κ°
})
})
.then(res=>{
if(res.ok){
alert('μ
λ°μ΄νΈκ° μλ£λμμ΅λλ€.')
}
})
μμ κ°μ νμμΌλ‘ μ¬μ©νλ€.
fetch
μ λλ²μ§Έ μΈμλ₯Ό μ¬μ©νμ§ μλλ€λ©΄ κΈ°λ³Έμ μΌλ‘ GET
λ©μλκ° μ¬μ©λλ©°, λλ²μ§Έ μΈμλ₯Ό μ¬μ©ν κ²½μ°μλ HTTP μμ² λ©μΈμ§λ₯Ό μμ±νλ€.
method
μλ μ¬μ©ν λ©μλλ₯Ό μ μ΄μ€λ€.
headers
λ headerλ₯Ό νλ‘νΌν°λ‘ κ°μ§ κ°μ²΄λ₯Ό κ°μ§λ©° 'Content-Type'
κ°μ κ²½μ°λ PUT
νλ λ°μ΄ν°μ μ’
λ₯λ₯Ό λͺ
μνλ ν€λμ΄λ€.
body
λ μ€μ§μ μΌλ‘ μλν¬μΈνΈμ μ
λ°μ΄νΈν νμ΄λ‘λκ° λ€μ΄κ°λ€.
fetch(`λ°μ΄ν°λ₯Ό μμ ν μλν¬μΈλ/id`, {
method: 'DELETE'
})
DELETE
λ©μλμ κ²½μ°λ λ°μ΄ν° μμ λ§ νλ©΄ λκΈ°μ λ³λ€λ₯Έ header λ° bodyλ₯Ό μ μ§ μμλ λλ€.
fetch('λ°μ΄ν°λ₯Ό μμ±ν endpoint',{
method: 'POST',
headers: {
'Content-Type': 'application/json'
},
body : JSON.stringify({
μΆκ°ν λ°μ΄ν° ν€ : λ°μ΄ν° κ°
})
})
.then(res=>{
if(res.ok){
alert('λ°μ΄ν°κ° μμ±λμμ΅λλ€.')
}
})
μμ λΉμ·νκ² μ¬μ©νλ©° μΆκ°ν λ°μ΄ν°μ κ²½μ°λ endpointλ‘ λ°μ΄ν°λ₯Ό μμ±ν pathλ§ λ£μ΄μ£Όλ©΄ λλ€.
κ·Έλ¦¬κ³ κ·Έ μΈ κΈ°μ‘΄ λ°μ΄ν°μμ νμμ λ§μΆ°μ λ°μ΄ν°λ₯Ό μμ±ν΄μ€λ€.
useRefλ λμ μ κ·Όν μ μκ² ν΄μ£Όλ ν
μ΄λ€.
μ΄ useRefλ₯Ό ν¬μ»€μ€λ₯Ό μ£Όκ±°λ μ€ν¬λ‘€ μμΉλ₯Ό νμΈνλ κ² λ±μ μ¬μ©ν μ μλ€.
function Comp () {
const varRef = useRef(null)
return (
<div>
<input type='text' ref={varRef} />
<button onClick={()=>{console.log(varRef.current.value)}}>μ
λ ₯</button>
</div>
)
}
μμ κ°μ΄ λ³μμ ν λΉν λ€μ jsx λ΄ DOM μμμ ref
μμ±μΌλ‘ μ°κ²°νλ€.
μ΄λ΄ κ²½μ° λ°μ΄ν°κ° κ°μ²΄ννλ‘ varRef
μ λ΄κΈ°κ² λλ©°,
current
λΌλ νλ‘νΌν° ν€μ DOM μμμΈ input
μ΄ κ°μΌλ‘ λ΄κΈ΄λ€.
κ·Έλ κΈ°μ varRef.current.value
λ‘ input
μ value
λ₯Ό μ¬μ©ν μ μκ² λλ κ²μ΄λ€.
useHistoryλ 리μ‘νΈ ν
μ μλκ³ λ¦¬μ‘νΈ λΌμ°ν°(react-router
)μμ μ§μνλ λ©μλμ΄λ€.
const variable = useHistory();
// λ€μκ³Ό κ°μ΄ ν λΉνκ³ ,
variable.push(`url-path`)
// λ€μκ³Ό κ°μ΄ μ¬μ©νλλ°, ν΄λΉ μ½λκ° μ€νλ λ hostμ ν΄λΉ pathλ‘ μ΄λνκ² λλ€.
리μ‘νΈ λ λΌμ°ν°μ <Link to='~'>
μ²λΌ a
νκ·Έλ₯Ό μ΄μ©νμ§ μκ³ λ νμ΄μ§λ₯Ό μ΄λνλλ° μ¬μ©νλ€.
μ€λλ§μ 리μ‘νΈλ₯Ό λ§λμ μ¬λ§ν건 λ€ κΈ°μ΅νλ€κ³ μκ°νλλ°, μλλ λ€λ₯ΌκΉ μμλ μμ΄λ¨Ήμκ² λ무 λ§μλ€.
μ½λ©μλ§λ μ νλΈλ₯Ό 보면μ λ€μ 볡μ΅νλλ° κ·Έλμ κΈ°μ΅μ΄ λ μ€λ₯΄λ©΄μ PTSD λ¨Έλ¦¬κ° μνμλ€ π
μ€λμ λΉ λ₯Έ μλ©΄ ~~λΉ λ₯Έ μλ©΄μ΄ 1μ~μΌλ‘ λ¨Έλ¦¬μ’ μν λ€μμ
λ΄μΌ μμΉ¨μ 빨리 μΌμ΄λμ 리μ‘νΈκ° νμ©νλ μ΄ κ°μλμ μ 리ν΄λ΄μΌκ² λ€.