本文给大家带来的是微信小程序代购详细说明正文页设计制作开发教程，制作好以后效果图如下：
一、wxml页面代码如下：
<!--pages/helpcentreAgentMember/helpcentreAgentMember.wxml-->
<view class="top">
<view class="topbefore"></view>
<view class="title">代购</view>
</view>
<view class="questions">
<block wx:for="{{questions}}">
<view class="common">
{{item.q}}
</view>
<view class="reply">
{{item.r}}
</view>
</block>
</view>
|
二、wxss样式文件代码如下：
/* pages/helpcentreAgentMember/helpcentreAgentMember.wxss */
.top{
margin-top:15px;
background-color:#ffffff;
padding:10px;
display:flex;
}
.topbefore{
width:3px;
background-color:red;
}
.title{
margin-left: 5px;
}
.questions{
padding:18px;
}
.common{
margin-bottom:15px;
color:#0398e7;
line-height: 20px;
}
.reply{
text-indent:20px;
color:#acacac;
line-height:20px;
font-size:14px;
}
|
三、js页面代码如下：
// pages/helpcentreAgentdetailMember/helpcentreAgentdetailMember.js
Page({
/**
* 页面的初始数据
*/
data: {
questions:[
{ "q": "1、佰客国际-佰客集运&国际转运购物发票如何获取 >>", "r":"您的每一笔消费，佰客集运&国际转运均可为您开具正式发票（商品发票由供应商开具。鉴于目前网络购物实际情况，淘宝网等拍卖网站绝大部分卖家将不会开具发票）。不过，鉴于海关可能会依据发票金额对您的货物征收关税，通常，佰客集运&国际转运并不会随包裹寄送。"}
]
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function () {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
}
})
|
.jpg)
.jpg)
