小程序裏常見的取值有以下幾種,一個完整的項目寫下來,用到的概率幾乎是100%。
- 列表index下標取值
- 頁面傳值
- form表單取值
1. 列表index下標取值
實現方式是:data-index="{{index}}"挖坑及e.currentTarget.dataset.index來填坑即可 。
1.1 生成值
1 |
|
在刪除圖標與文字添加data-index="{{index}}"自定義屬性以及綁定點擊事件bindtap="delete"
<view data-index="{{index}}" bindtap="delete" wx:for="{{array}}"><image src="../../../images/icon_delete.png" /><text>刪除{{item}}</text></view>
實現delete方法,取到index下標值。
delete: function (e) {
var index = parseInt(e.currentTarget.dataset.index);
console.log("index" + index);
}
如果不使用e.currentTarget而使用e.target會怎樣?
將會導致僅點中<view>才能輸出index值,點子元素<image>或<text>將輸出NaN。
那target有什麼用呢,用於區分子元素與外部元素要分別處理時,比如換用戶頭像的場景,點擊頭像本身預覽大圖,而頭像所在的點整一行,將是切換頭像。
1.2 取出值
試圖從index數據中找出相應元素刪除地址
// 找到當前地址AVObject對象
var address = that.data.addressObjects[index];
// 給出確認提示框
wx.showModal({
title: '確認',
content: '要刪除這個地址嗎?',
success: function(res) {
if (res.confirm) {
// 真正刪除對象
address.destroy().then(function (success) {
// 刪除成功提示
wx.showToast({
title: '刪除成功',
icon: 'success',
duration: 2000
});
// 重新加載數據
that.loadData();
}, function (error) {
});
}
}
})
2. 頁面傳值
從收貨地址列表頁中傳地址id到編輯頁面,以讀取原地址供修改之用
address/list頁面實現以下代碼
<view class="container" data-index="{{index}}" bindtap="edit"><image src="../../../images/icon_edit.png" /><text>編輯</text></view>
js:
edit: function (e) {
var that = this;
// 取得下標
var index = parseInt(e.currentTarget.dataset.index);
// 取出id值
var objectId = this.data.addressObjects[index].get('objectId');
wx.navigateTo({
url: '../add/add?objectId='+objectId
});
},
address/add頁面實現onLoad(options)方法,從url路徑中獲取objectId
onLoad: function (options) {
var objectId = options.objectId
}