页面使用的是weui的组件。主要实现的思路:
1、从地址管理页跳转过来,在onload里面将传过来的参数address获取后,渲染到前台页面;同时将address数据缓存到本地;
2、修改地址后提交,提交的数据与缓存中的数据值比对。
注意点:从上一个页面中传过来的参数是对象转的字符串,当前页要转其转为json对象,方便获取数据。【JSON.stringify()将对象、数组转换成字符串;JSON.parse()将字符串转成json对象。】
wxml
js
Page({
/**
* 页面的初始数据
*/
data: {
contactInfo:null,
region: ['请点击选择'], //省市区选择器
customItem: '全部',
province: "",
city: "",
district: "",
street: "",
contactname: "",
contact_tel: "",
addressid: "",
userid: ""
},
//改变省市区picker的事件
bindRegionChange: function(e) {
console.log(e)
this.setData({
region: e.detail.value,
postcode: e.detail.postcode
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
console.log(options)
var that = this
var address = JSON.parse(options.address)
//将传过来的参数存储于本地,修改后的值与之比对
wx.setStorage({
key: 'contactInfo',
data: options.address
})
var addressArr = [address.province, address.city, address.district]
// console.log(addressArr)
that.setData({
addressid: address.addressid,
userid: address.userid,
contactname: address.contactname,
contact_tel: address.contact_tel,
region: addressArr,
street: address.street,
})
},
//修改提交
modifySubmit:function(e){
console.log(e)
var that = this
var value = wx.getStorageSync('contactInfo')
//console.log(value)
wx.getStorage({
key: 'contactInfo',
success(res) {
//console.log(res.data)
that.setData({
contactInfo: res.data
})
}
})
wx.request({
url: 'xxxx.com/api/Address/uptAddr',
header: {
'content-type': 'application/json'
},
method: 'POST',
data: {
province: e.detail.value.region[0],
city: e.detail.value.region[1],
district: e.detail.value.region[2],
street: e.detail.value.street,
contactname: e.detail.value.contactname,
contact_tel: e.detail.value.contacttel,
addressid: e.detail.value.addressid,
userid: e.detail.value.userid
},
success: function (res) {
console.log(res)
if (res.statusCode == 200) {
wx.showToast({
title: '提交成功',
success:function(res){
setTimeout(function(){
wx.navigateBack({ delta: 1, })
},1000)
}
})
}
},
fail: function (res) { },
complete: function (res) { }
})
},
//删除
delAddr: function(e){
var that = this
wx.showModal({
title: '提示',
content: '确定要删除该地址吗?',
success(res) {
if (res.confirm) {
//console.log('用户点击确定')
wx.request({
url: 'xxxx.com/api/Address/delAddr',
header: { 'content-type': 'application/json' },
method: 'POST',
data: {
addressid: that.data.addressid,
userid: that.data.userid
},
success: function (res) {
console.log(res)
wx.showToast({
title: '删除成功',
success: function (res) {
setTimeout(function () {
wx.navigateBack({ delta: 1, })
}, 1000)
}
})
}
})
} else if (res.cancel) {
console.log('用户点击取消')
return false
}
}
})
}
})