小編給大家分享一下小程序怎么動(dòng)態(tài)增加刪除JSON對(duì)象數(shù)組,希望大家閱讀完這篇文章后大所收獲,下面讓我們一起去探討吧!
公司主營(yíng)業(yè)務(wù):網(wǎng)站設(shè)計(jì)、網(wǎng)站建設(shè)、移動(dòng)網(wǎng)站開(kāi)發(fā)等業(yè)務(wù)。幫助企業(yè)客戶真正實(shí)現(xiàn)互聯(lián)網(wǎng)宣傳,提高企業(yè)的競(jìng)爭(zhēng)能力。成都創(chuàng)新互聯(lián)公司是一支青春激揚(yáng)、勤奮敬業(yè)、活力青春激揚(yáng)、勤奮敬業(yè)、活力澎湃、和諧高效的團(tuán)隊(duì)。公司秉承以“開(kāi)放、自由、嚴(yán)謹(jǐn)、自律”為核心的企業(yè)文化,感謝他們對(duì)我們的高要求,感謝他們從不同領(lǐng)域給我們帶來(lái)的挑戰(zhàn),讓我們激情的團(tuán)隊(duì)有機(jī)會(huì)用頭腦與智慧不斷的給客戶帶來(lái)驚喜。成都創(chuàng)新互聯(lián)公司推出桐城免費(fèi)做網(wǎng)站回饋大家。
先看效果,在制作小程序時(shí),經(jīng)常遇到類似這種情況:
直接上代碼:
添加 {{item.time}} 刪除
.add-btn{ background: chocolate; width: 200rpx; text-align: center; color: white; margin-bottom: 10px; } .list{ display: flex; justify-content: space-around; border: 1px solid; } .delete-btn{ background: red; }
Page({ data: { itemLists: [ { id: 1, time: '00:00:00' }, { id: 2, time: '00:00:00' }, { id: 3, time: '00:00:00' } ] }, addItems() { let list = this.data.itemLists list.push({ id: ~~(Math.random()*100), time: '00:00:00' }) this.setData({ itemLists: list }) }, deleteIitems(e) { let idx = e.currentTarget.dataset.idx let list = this.data.itemLists let filterRes = list.filter((ele,index) => { return index != idx }) this.setData({ itemLists: filterRes }) } })
總結(jié):
關(guān)鍵處是使用ES6中的filter過(guò)濾方法,刪除對(duì)象數(shù)組中的第幾個(gè)對(duì)象。
過(guò)濾更多的時(shí)候是用在過(guò)濾掉指定的內(nèi)容。
看完了這篇文章,相信你對(duì)小程序怎么動(dòng)態(tài)增加刪除JSON對(duì)象數(shù)組有了一定的了解,想了解更多相關(guān)知識(shí),歡迎關(guān)注創(chuàng)新互聯(lián)行業(yè)資訊頻道,感謝各位的閱讀!