主要函數
```
/**
* 獲取電影詳情
*/
getdetail: function(movieid) {
wx.showLoading({
title: '加載中',
}) var _this = this;
var movieId = movieid
var url = 'http://test.36519.com/api/index/detail.html?moiveid=' + movieid;
console.log(url);
App._get(url, {},
function(result) {
//console.log(result);
_this.setData({
detail: result.data,
});
});
wx.hideLoading();
console.log(_this.data);
},
```
在comment.js中把id提交到相應的接口獲取電影詳情
2.comment.js文件
```
// pages/comment/comment.js
var App = getApp();
Page({
/**
* 頁面的初始數據
*/
data: {
detail: [],
},
/**
* 獲取電影詳情
*/
getdetail: function(movieid) {
wx.showLoading({
title: '加載中',
}) var _this = this;
var movieId = movieid
var url = 'http://test.36519.com/api/index/detail.html?moiveid=' + movieid;
console.log(url);
App._get(url, {},
function(result) {
//console.log(result);
_this.setData({
detail: result.data,
});
});
wx.hideLoading();
console.log(_this.data);
},
/**
* 生命周期函數--監聽頁面加載
*/
onLoad: function(options) {
//console.log(options);
this.getdetail(options.movieid);
},
/**
* 生命周期函數--監聽頁面初次渲染完成
*/
onReady: function() {
},
/**
* 生命周期函數--監聽頁面顯示
*/
onShow: function() {
},
/**
* 生命周期函數--監聽頁面隱藏
*/
onHide: function() {
},
/**
* 生命周期函數--監聽頁面卸載
*/
onUnload: function() {
},
/**
* 頁面相關事件處理函數--監聽用戶下拉動作
*/
onPullDownRefresh: function() {
},
/**
* 頁面上拉觸底事件的處理函數
*/
onReachBottom: function() {
},
/**
* 用戶點擊右上角分享
*/
onShareAppMessage: function() {
}
})
```
3.comment.wxml文件
```
{{detail.name}}
{{detail.leader}}
{{detail.score}}分
kkkkk
導演：xxxx
{{detail.content}}
```
4.comment.wxss文件
```
/* pages/comment/comment.wxss */
.detail - container {
height: 400rpx;
filter: blur(40rpx);
opacity: 0.4;
}
.detail - mask {
position: absolute;
width: 100 % ;
height: 400rpx;
background - color: #333;
top: 0;
left: 0;
z - index: -1;
}
.detail - img {
width: 280rpx;
height: 90 % ;
margin - right: 24rpx;
}
.detail - info {
display: flex;
position: absolute;
top: 0;
left: 0;
width: 100 % ;
height: 400rpx;
padding: 20rpx;
}
.detail {
flex - grow: 1;
line - height: 60rpx;
}
.detail view {
color: #fff;
font - size: 24rpx;
}
.detail.detail - nm {
font - size: 40rpx;
font - weight: 700;
}
.detail.sc {
color: #fc0;
font - size: 36rpx;
font - weight: 700;
}
.desc {
padding: 20rpx;
color: #555;
font - size: 24rpx;
}
.comment - container {
padding: 0 20rpx;
}
.comment {
padding: 10rpx;
}
.comment - content {
border: 1px solid#ccc;
width: 100 % ;
box - sizing: border - box;
font - size: 32rpx;
border - radius: 8rpx;
padding: 20rpx;
}
.comment - image image {
width: 200rpx;
height: 200rpx;
margin: 10rpx;
}
.comment - img {
width: 200rpx;
height: 200rpx;
margin: 20rpx 20rpx 0 0;
}
```
5.效果
