微信小程序 數(shù)組（增，刪，改，查）等操作實(shí)例詳解
微信小程序 數(shù)組（增，刪，改，查）等操作
最近在做一個小程序的demo。由于不向后臺請求數(shù)據(jù)，所以就涉及到對本地?cái)?shù)據(jù)的操作，也遇到了一些坑，本文就以數(shù)組的增刪改查為例，給新手分享一些經(jīng)驗(yàn)。
首先這是原始數(shù)據(jù)，json的數(shù)組。
我們嘗試對改數(shù)據(jù)進(jìn)行操作，同時渲染到頁面。
1，數(shù)據(jù)的添加
在獲取到表單的數(shù)據(jù)后，自己組裝一個對象，然后通過push()的方法添加一條數(shù)據(jù)，注意push的數(shù)據(jù)的index是+1的，也就是說原本數(shù)組中index依次為0，1，2，新增加的就是3，依次類推。
如果想在前面插入數(shù)據(jù)，就要用到數(shù)組合并的操作了，concat()方法可以選擇合并到前面或者后面例如newarray.concat(notes);。
2，數(shù)據(jù)的刪除
小程序里面貌似沒有remove的方法，所以刪除我選擇的是split方法，這也是遇到的一個坑。notes.splice(id,i)就可以從index為id的位置開始，刪除i個元素，這點(diǎn)大家都懂，看代碼就明白，不再贅述
3，數(shù)據(jù)的修改
notes = obj可以把數(shù)組中index為i的元素設(shè)置為obj。
最后，如果要在修改數(shù)據(jù)的同時渲染到頁面，一定要記得使用setData方法。
this.setData({ notes:notes })
順便附上js里面array操作的方法列表。大家可以自己試試。
- 微信小程序 for 循環(huán)詳解
- 微信小程序 input輸入框控件詳解及實(shí)例（多種示例）
- 微信小程序 跳轉(zhuǎn)頁面的兩種方法詳解
- 微信小程序開發(fā)（二）圖片上傳+服務(wù)端接收詳解
- 微信小程序 傳值取值的幾種方法總結(jié)
- 微信小程序-消息提示框?qū)嵗?/a>
- 微信小程序 input輸入框詳解及簡單實(shí)例
- 微信小程序 wx.request(接口調(diào)用方式)詳解及實(shí)例
- 微信小程序 頁面跳轉(zhuǎn)傳參詳解
- 微信小程序 觸控事件詳細(xì)介紹
- 微信小程序通過api接口將json數(shù)據(jù)展現(xiàn)到小程序示例
- 微信小程序 小程序制作及動畫（animation樣式）詳解
- 微信小程序中使元素占滿整個屏幕高度實(shí)現(xiàn)方法
- 微信小程序 參數(shù)傳遞詳解
- 微信小程序 實(shí)現(xiàn)列表刷新的實(shí)例詳解
- 微信小程序 wx.request合法域名配置詳解
- 微信小程序設(shè)置http請求的步驟詳解
- 微信小程序里使用SVG矢量圖標(biāo)方法詳解
相關(guān)文章
這篇文章主要為大家介紹了ECMAScript?modules規(guī)范示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-11-11
這篇文章主要為大家介紹了2023年了該了解下WebComponent使用教程，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-02-02
微信小程序 利用css實(shí)現(xiàn)遮罩效果實(shí)例詳解
這篇文章主要介紹了微信小程序 利用css實(shí)現(xiàn)遮罩效果實(shí)例詳解的相關(guān)資料,需要的朋友可以參考下2017-01-01
jscpd統(tǒng)計(jì)項(xiàng)目中的代碼重復(fù)度使用詳解
這篇文章主要為大家介紹了jscpd統(tǒng)計(jì)項(xiàng)目中的代碼重復(fù)度使用詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-03-03
這篇文章主要為大家介紹了JavaScript對象管家Proxy使用示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-03-03
這篇文章主要為大家介紹了異步觀察目標(biāo)元素方式完成分頁加載示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-07-07
這篇文章主要為大家介紹了JS SVG獲取驗(yàn)證碼的玩法示例，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2022-07-07
腳本整合指定文件/文件夾執(zhí)行定制化ESLint命令使用實(shí)例
這篇文章主要為大家介紹了腳本整合指定文件/文件夾執(zhí)行定制化?ESLint命令使用實(shí)例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進(jìn)步,早日升職加薪2023-11-11
JavaScript使用JSON.stringify()方法帶參及不帶參示例詳解
這篇文章主要介紹了JavaScript使用JSON.stringify()方法帶參及不帶參示例詳解，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-07-07
pnpm?tauri?build?默認(rèn)com.tauri.dev打包報錯解決
這篇文章主要介紹了pnpm?tauri?build?默認(rèn)com.tauri.dev打包報錯解決方式，有需要的朋友可以借鑒參考下，希望能夠有所幫助，祝大家多多進(jìn)步，早日升職加薪2023-08-08