(ToDo List專案)S3L23-雙擊修改資料內容

編輯待辦事項

 原本下方有放一個輸入框

在<li>點兩下時，呼叫editTodo method,並把此item物件傳入

 新增editTodo method,測試看看是否可印出item

 data新增 cacheTodo/cacheTitle 當成暫存的todo

 雙擊之後的的item設定為cache

 把原本<input>移到上方<li>內部

 當目前cacheTodo的id與item的id不一樣時，才顯示div區塊

id相同時

顯示下面的input

 ＊一開始cacheTodo.id為undefined  與 item.id不同，所以會顯示div區塊

點兩下後要在input框帶入原本的文字(透過v-model雙向綁定cacheTitle)

修改文字時，就會連動到cacheTitle




取消編輯(在input時按ESC)

 將cacheTodo設為預設值(空物件)

 編輯完成

此時編輯過的文字會連動到cacheTitle(v-model)

直接拿來將item的title改掉

流程圖