您好,登錄后才能下訂單哦!
這篇文章給大家介紹怎么在vue.js中刪除列表中的一行,內(nèi)容非常詳細(xì),感興趣的小伙伴們可以參考借鑒,希望對(duì)大家能有所幫助。
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.js中刪除列表中的一行就分享到這里了,希望以上內(nèi)容可以對(duì)大家有一定的幫助,可以學(xué)到更多知識(shí)。如果覺(jué)得文章不錯(cuò),可以把它分享出去讓更多的人看到。
免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀(guān)點(diǎn)不代表本網(wǎng)站立場(chǎng),如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱:is@yisu.com進(jìn)行舉報(bào),并提供相關(guān)證據(jù),一經(jīng)查實(shí),將立刻刪除涉嫌侵權(quán)內(nèi)容。