课程名称: 破解JavaScript高级玩法
课程章节: 课程导学
主讲老师: Cloud
课程内容:
今天学习的内容包括:
课程的基本介绍
课程收获:
15.1 心得:
var app = getApp();
Page({
data: {
scenicSpot: [],
num: 1,
toView: '',
height: "",
realHeight: 1,
imgUrls: [],
scenicSpotId: ""
},
jumpTo: function(e) {
let target = e.currentTarget.dataset.opt;
this.setData({
// num: e.currentTarget.dataset.num,
toView: target
});
},
getBusinessDetailInfo: function() {
var that = this;
wx.showLoading({
title: "数据加载中..."
});
wx.request({
url: app.getUrl(app.globalData.businessDetailInfo),
data: {
scenicSpotId: that.data.scenicSpotId,
},
success: function(res) {
var result = res.data;
if (result.result) {
that.setData({
scenicSpot: result.data
});
if (result.data != null) {
that.setData({
imgUrls: result.data.Pictures
});
}
}
wx.hideLoading();
},
fail: function(err) {
wx.hideLoading();
}, //请求失败
complete: function() {} //请求完成后执行的函数
});
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function(options) {
var that = this;
// 获取系统信息
wx.getSystemInfo({
success: function(res) {
// 计算主体部分高度,单位为px
that.setData({
height: res.windowHeight
})
}
})
that.data.scenicSpotId = options.scenicSpotId;
that.getBusinessDetailInfo();
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function() {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function() {
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function() {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function() {
},
/**
* 页面相关事件处理函数--监听用户下拉动作
*/
onPullDownRefresh: function() {
},
/**
* 页面上拉触底事件的处理函数
*/
onReachBottom: function() {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function() {
}
})
/* pages/scenicIntroduce/scenicIntroduce.wxss */
page {
background: #fff;
}
.choose_list {
position: fixed;
z-index: 9;
display: flex;
justify-content: space-between;
line-height: 1;
width: 100%;
top: 0;
padding: 26rpx 0;
background-color: #fff;
border-bottom: 1rpx solid #f5f5f5;
}
.scenic_introduce {
display: flex;
flex-direction: column;
margin: 0 30rpx 80rpx 30rpx;
}
.choose_left{
margin-left: 30rpx;
}
.choose_right{
margin-right: 30rpx;
}
.title {
display: flex;
font-size: 36rpx;
font-weight: bold;
padding-bottom: 30rpx;
padding-top: 80rpx;
}
.scenic_inro_title{
display: flex;
font-size: 36rpx;
font-weight: bold;
padding-bottom: 30rpx;
padding-top: 120rpx;
}
.text {
font-size: 26rpx;
}
.image_list {
display: flex;
justify-content: space-between;
margin-bottom: 30rpx;
}
.scenic_inro_image {
width: 340rpx;
height: 190rpx;
}