一篇文章教會你創(chuàng)建vue項目和使用vue.js實現(xiàn)數(shù)據增刪改查
【六、數(shù)據添加方法】
1、獲取到id 和name,在data 上面獲取。
2、組織出一個對象,把這個對象調用數(shù)組的相關方法,添加到當前data 上的 list 中。
3、在Vue.js中已經實現(xiàn)了數(shù)據雙向綁定,每當我們修改了data中的數(shù)據后,監(jiān)聽到數(shù)據改名,自動把最新數(shù)據顯示在頁面。
4、在進行VM中的Model數(shù)據操作,同時,在操作Model數(shù)據的時候,指定的業(yè)務邏輯操作。
5、代碼如下圖:
【七、數(shù)據刪除方法】
1、如何根據Id,找到要刪除這一項的索引值。
2、當找到索引了就調用數(shù)組的 splice方法。
3、代碼如下圖:
【八、數(shù)據修改方法】
1、定義一個在data自定義一個數(shù)組用來保存修改后的數(shù)據edit:[];
2、在方法里面定義對象,根據Id,找到修改這一項的索引值,找到索引值后數(shù)據就會更改。
3、代碼如下圖:
【九、數(shù)據查詢方法】
1、forEach 、some 、filter 、findIndex這些都屬于數(shù)組的新方法,都會對數(shù)組中的每一項,進行遍歷,執(zhí)行相關的操作。
2、在ES6中,為字符串提供了一個新方法,String.prototype.includes('要包含的字符串'),如果包含,則返回 true ,否則返回 false。
3、代碼如下圖:
【十、總結】
1、創(chuàng)建vue項目使用cmd命令安裝npm、cnpm、vue-cli、webpack,輸入vue ui開始創(chuàng)建vue項目。
2、刪除方法,可以使用索引,為每一行設置一個id屬性值,然后刪除總數(shù)據id屬性值的那個項。
3、操作Model數(shù)據的時候,指定的業(yè)務邏輯操作。

請輸入評論內容...
請輸入評論/評論長度6~500個字