微信小程式生成詳情內容頁 Thinkphp後臺呼叫資料庫
阿新 • • 發佈:2018-12-13
列表頁連結加上產品ID,如下:
<navigator url="../goods/goods?goods_id={{item.goods_id}}" ></navigator>
wxml頁面:
<!--pages/goods/goods.wxml--> <scroll-view scroll-y="true"> <view class="meta"> <image class="poster" mode="aspectFit" src="{{imgurl}}{{goods.goods_big_img}}" ></image> <text class="title">{{goods.goods_name}}</text> <text class="info">價格:{{goods.goods_price}}</text> <text class="info">數量:{{goods.goods_number}}</text> <text class="info">時間:{{goods.goods_create_time}}</text> </view> <view class="summary"> <text class="label">商品描述:</text> <text class="content">{{goods.goods_introduce}}</text> </view> </scroll-view>
js頁面:
// pages/goods/goods.js const app = getApp() Page({ /** * 頁面的初始資料 */ data: { imgurl: "https://cs.xxxxxx.com/shop/", goods: [] }, /** * 生命週期函式--監聽頁面載入 goods_id: params.goods_id */ onLoad: function (params) { wx.showToast({ title: "載入中..", icon: "loading", duration: 10000 }); var that = this; console.log(params); wx.request({ url: "https://cs.xxxxxx.com/shop/index.php/Home/Goods/detailjson/goods_id/" + params.goods_id, data: {}, header: { 'content-type': 'json' // 預設值 }, success: function (res) { // console.log(res.data.info); wx.hideToast(); that.setData({ goods: res.data.info }) }, }) }, /** * 生命週期函式--監聽頁面初次渲染完成 */ onReady: function () { }, /** * 生命週期函式--監聽頁面顯示 */ onShow: function () { }, /** * 生命週期函式--監聽頁面隱藏 */ onHide: function () { }, /** * 生命週期函式--監聽頁面解除安裝 */ onUnload: function () { }, /** * 頁面相關事件處理函式--監聽使用者下拉動作 */ onPullDownRefresh: function () { }, /** * 頁面上拉觸底事件的處理函式 */ onReachBottom: function () { }, /** * 使用者點選右上角分享 */ onShareAppMessage: function () { } })
wxss頁面(隨便寫的可以忽略):
/* pages/goods/goods.wxss */ .meta { display: flex; flex-direction: column; align-items: center; height: 500rpx; padding: 50rpx 40rpx; } .title { font-size: 34rpx; color: #444; } .info { font-size: 30rpx; color: #666; margin-top: 20rpx; width: 80%; } .summary { width: 80%; margin: 30rpx auto; } .label { display: block; } .content { color: #666; font-size: 20rpx; padding: 10rpx }
Thinkphp後臺(3.2.3):
public function detailjson(){
S(array('prefix'=>('detailjson'.I('goods_id'))));
if(!S('detailjson')){
$goods = D('Goods');
$info = $goods -> find(I('goods_id'));
$data['info']=$info;
S('detailjson',$data,300);//300秒 5分
dump($this->ajaxReturn($data,'json'));
exit;
}else{
dump($this->ajaxReturn(S('detailjson')));
exit;
}
}
結束!
類似這樣的(磕磣點.. 哈哈哈):