3/3-6

axiosのpostメソッド

const newTask=(task)=>{
const data={
title:task.title
}
headers:{
"Content-Type":"application/json",
"Authorization":"Token トークン",
}
}).then(res=>{setTasks([...tasks,res.data])})
}
  • .post()
    • 新たにDBに加えることができる
    • 第1引数にURL
    • 第2引数に加えるデータ
    • 第3引数にheaders
    • postメソッドに続けてsetTaskでシングルページ化の処理
<input type="text" name="title" value={editedTask.title} onChange={HandleInputChange()} placeholder="New task" required />
<button onClick={()=>{newTask(editedTask)}}>Create</button>
  • placeholder属性
    • テキストボックス内に表示される「例」
  • required
    • 入力必須
const HandleInputChange=()=>evt=>{
const value=evt.target.value;
const name=evt.target.name;
setEditedTask({...editedTask,[name]:value})
}

 

  • [name]のようにObjectにする意味(title)は?