一、业务说明

点击订单列表中的某个订单后进入订单详情页，进入详情页时从后台拿到这个订单的详细数据，之后根据数据把相关信息赋值到页面

二、问题说明

拿到数据后其中有个产品id需要给显示产品的dom上赋值属性 data-id 用于点击这个dom进入到该产品的详情页 ，但是拿到的pid赋值给dta-id后再控制台显示的是undefined(实际上测试也没有这个拿到这个id)而如果把这个只显示在别的地方则能正常显示详细如下

三、代码

1. 从后台拿到的是一个一维数组

   
   如图拿到的数据中存在p_id

2. 数据拿到后修改 order    在页面输出

3. 

4. 代码中黄色圈和控制台中黄色圈  是对应输出的东西，同样的代码在 data-id中是 undefined 而在 文本中 直接能输出1 (控制台绿色圈中 默认套餐后面的 数字1 ) 不知道为什么 ？  不管是data-id  还是 url=""  只要是属性 就不行 不知道是不是 属性赋值必须要遍历？ 因为获取到的直接是一维数组  没有考虑去遍历一次。哪位大神指导原因 麻烦告知一下。

js:

// pages/myorder/details.js

var Common = require(’…/…/utils/Common.js’);

Page({

/**

  * 页面的初始数据

  */

data: {

order:{},

},

/**

  * 生命周期函数–监听页面加载

  */

onLoad: function (options) {

let id = options.id;

let _this = this;

Common.post(‘Home/Wechat/getOrderDetails’, { wxSession: wx.getStorageSync(“third_Session”), id: id }, ‘GET’).then(res => {

console.log(res.data.data);

_this.setData({

order: res.data.data

});

}).catch(err => {

//console.log(err);

})

},

/**

  * 生命周期函数–监听页面初次渲染完成

  */

onReady: function () {

},

/**

  * 生命周期函数–监听页面显示

  */

onShow: function () {

},

/**

  * 生命周期函数–监听页面隐藏

  */

onHide: function () {

},

/**

  * 生命周期函数–监听页面卸载

  */

onUnload: function () {

},

/**

  * 页面相关事件处理函数–监听用户下拉动作

  */

onPullDownRefresh: function () {

},

/**

  * 页面上拉触底事件的处理函数

  */

onReachBottom: function () {

},

/**

  * 用户点击右上角分享

  */

onShareAppMessage: function () {

},

//进入宝贝详情页

toGoods:function(e){

let id = e.currentTarget.dataset.id;  

wx.navigateTo({

url: ‘/pages/details/details?id’+id,

})

}

})

wxml：

<!–pages/myorder/details.wxml–>

<view class=“content”>

<view class=“list adderss”>

<view class=“ico_1”>

<image src="…/…/images/address.png"></image>

</view>

<view class=“address-inf”>

<view class=“layer_1”>

<text>{{order.address_user_name}}</text>

<text>{{order.address_user_phone}}</text>

</view>  

<view class=“layer_2”>

{{order.address_user_address}}

</view>    

</view>

</view>

<view class=“list product” bindtap=“toGoods” data-id="{{order.p_id}}">

<view class=“product-box”>

<view class=“pic”>

<image src="{{order.pic}}"></image>

</view>

<view class=“goods-inf”>

<view class=“title”>{{order.goods_title}}</view>

<view class=“sku-inf”>规格：{{order.skuname}}{{order.p_id}}</view>

<view class=“buy_inf”>

<text>￥{{order.p_rmb}}</text>

<text class=“sum”>×{{order.sum}}</text>

</view>

</view>

</view>

<view class=“rmb-box”>

<view class=“layer_a”>

<text>商品总价</text>

<text>￥{{order.p_rmb * order.sum}}</text>

</view>

<view class=“layer_b”>

<text>订单总价</text>

<text>￥{{order.all_rmb}}</text>

</view>

<view class=“layer_c”>

<text>实付金额</text>

<text class=“this-font-color”>￥{{order.all_rmb}}</text>

</view>

</view>  

</view>

<view class=“list order-inf”>

<view class=“order-inf-hd”>订单信息</view>

<view class=“order-inf-bd”>

<view class=“inf-list”>

<text class=“title”>订单备注: </text>

<text>{{order.remarks}}</text>

</view>

<view class=“inf-list”>

<text class=“title”>订单编号: </text>

<text>{{order.order_id}}</text>

</view>

<view class=“inf-list”>

<text class=“title”>支付编号: </text>

<text>{{order.pay_id}}</text>

</view>

<view class=“inf-list”>

<text class=“title”>创建时间: </text>

<text>{{order.time}}</text>

</view>

<view class=“inf-list”>

<text class=“title”>付款时间: </text>

<text>{{order.pay_time}}</text>

</view>

<view class=“inf-list”>

<text class=“title”>发货时间: </text>

<text>{{order.fh_time}}</text>

</view>

<view class=“inf-list”>

<text class=“title”>成交时间: </text>

<text>{{order.ok_time}}</text>

</view>

</view>

</view>

<view class=“menu”>

<block wx:if="{{order.order_state == 1}}">

<view class=“menu-box”>

取消订单

</view>                

</block>

<view class=“menu-box this-font-color this-bd-color”>

<block wx:if="{{order.order_state == 1}}">

立即支付

</block>

<block wx:elif="{{order.order_state == 2}}">

修改地址

</block>

<block wx:elif="{{order.order_state == 3}}">

确认服务

</block>

<block wx:elif="{{order.order_state == 4}}">

立即评价

</block>

</view>

</view>

</view>