vue.js刪除列表中的一行
更新時(shí)間：2018年06月30日 09:39:12 作者：時(shí)光足跡
這篇文章給大家分享了vue.js刪除列表中的一行的實(shí)例操作以及代碼分享，有興趣的朋友參考下。
splice(index,num,item1,item2,...,itemX) 方法向/從數(shù)組中添加/刪除項(xiàng)目，然后返回被刪除的項(xiàng)目。
注：index--規(guī)定添加/刪除項(xiàng)目的位置
num--要?jiǎng)h除的項(xiàng)目數(shù)量
item--向數(shù)組添加的新項(xiàng)目
splice() 方法可刪除從 index 處開(kāi)始的零個(gè)或多個(gè)元素，并且用參數(shù)列表中聲明的一個(gè)或多個(gè)值來(lái)替換那些被刪除的元素。
如果從 arrayObject 中刪除了元素，則返回的是含有被刪除的元素的數(shù)組。
(1)html代碼：
<div id="app">
<ul>
<li v-for="todo in todos">
<span>{{ todo.text }}</span>
<button @click="removeTodo($index)">X</button>
</li>
</ul>
</div>
（2）js代碼：
<script>
new Vue({
el: '#app',
data: {
todos: [
{ text: 'Add some todos' },
{ text: 'Learn JavaScript' },
{ text: 'Learn Vue.js' },
{ text: 'Build Something Awesome' }
]
},
methods: {
removeTodo: function (index) {
this.todos.splice(index, 1);
}
}
})
</script>
（3）效果展示：
相關(guān)文章
這篇文章主要介紹了Vue?配置代理詳情，文章圍繞主題的相關(guān)資料展開(kāi)詳細(xì)內(nèi)容介紹，具有一定的參考價(jià)值，需要的小伙伴可以參考一下，希望對(duì)你的學(xué)習(xí)有所幫助2022-04-04
vue19 組建 Vue.extend component、組件模版、動(dòng)態(tài)組件 的實(shí)例代碼
這篇文章主要介紹了vue19 組建 Vue.extend component、組件模版、動(dòng)態(tài)組件 的實(shí)例代碼,非常不錯(cuò)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2019-04-04
vue+elementUi 實(shí)現(xiàn)密碼顯示/隱藏+小圖標(biāo)變化功能
這篇文章主要介紹了vue+elementUi 實(shí)現(xiàn)密碼顯示/隱藏+小圖標(biāo)變化功能,需本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-01-01
Typescript 5年內(nèi)的熱度隨時(shí)間變化的趨勢(shì)，整體呈現(xiàn)一個(gè)上升的趨勢(shì)。也說(shuō)明ts越來(lái)越️受大家的關(guān)注了。這篇文章主要介紹了Vue 中使用 typescript的方法詳解,需要的朋友可以參考下2020-02-02
基于elementUI使用v-model實(shí)現(xiàn)經(jīng)緯度輸入的vue組件
這篇文章主要介紹了基于elementUI使用v-model實(shí)現(xiàn)經(jīng)緯度輸入的vue組件,本文給大家介紹的非常詳細(xì)，具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2019-05-05
Vue系列之Element?UI表單自定義校驗(yàn)規(guī)則
表單校驗(yàn)是注冊(cè)環(huán)節(jié)中必不可少的操作,表單校驗(yàn)可以提醒用戶填寫數(shù)據(jù)規(guī)則以確保用戶提交數(shù)據(jù)的效性,也可以防止用戶因誤操作而占用服務(wù)器資源,這篇文章主要給大家介紹了關(guān)于Vue系列之Element?UI表單自定義校驗(yàn)規(guī)則的相關(guān)資料,需要的朋友可以參考下2022-09-09
element?plus如何為表格某列數(shù)據(jù)文字設(shè)置顏色樣式
實(shí)習(xí)工作需要根據(jù)表格的狀態(tài)字段來(lái)設(shè)置列的樣式,所以這篇文章主要給大家介紹了關(guān)于element?plus如何為表格某列數(shù)據(jù)文字設(shè)置顏色樣式的相關(guān)資料,需要的朋友可以參考下2023-10-10
.netcore+vue 實(shí)現(xiàn)壓縮文件下載功能
這篇文章主要介紹了.netcore+vue 實(shí)現(xiàn)壓縮文件下載功能,本文通過(guò)實(shí)例代碼給大家介紹的非常詳細(xì)，對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值，需要的朋友可以參考下2020-09-09
TypeScript 是一種由微軟開(kāi)發(fā)的自由和開(kāi)源的編程語(yǔ)言，它是 JavaScript 的一個(gè)超集，擴(kuò)展了 JavaScript 的語(yǔ)法。這篇文章主要介紹了Vue新搭檔TypeScript快速入門實(shí)踐,需要的朋友可以參考下2021-06-06
這篇文章主要介紹了讓Vue響應(yīng)Map或Set的變化操作，具有很好的參考價(jià)值，希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2020-11-11