微信小程序–音乐播放器(Java爬虫后台在下文篇章公布)
主页面:
wxml:
css就不展示了,比较多
<view class='container' style='width:{
{wid}} height={
{he}}'>
<view class="inputView">
<form bindsubmit='submit'>
<input class="input" type="text" value="{
{toname}}" name="toname" placeholder-style="color: red" />
<view class='bt'>
<button type="default"plain="true" form-type='submit'><image src='../../images/08f790529822720e679f1edc70cb0a46f21fab47.jpg' ></image></button>
</view>
</form>
</view>
<view class='swiper'>
<swiper indicator-dots="{
{indicatorDots}}"
autoplay="{
{autoplay}}"
interval="{
{interval}}"
duration="{
{duration}}">
<block wx:for="{
{lunbo}}">
<swiper-item><image src='{
{item}}'></image></swiper-item>
</block>
</swiper>
</view>
<view class='rank'>
<view class='rank-h' bindtap='xingeClick'><view class='rank-i'><image src='../../images/20190321162220.png'></image></view>新歌榜 </view>
<view class='rank-h' bindtap='regeClick'><view class='rank-i'><image src='../../images/20190321162328.png'></image></view>热歌榜 </view>
<view class='rank-h' bindtap='biaoshengClick'><view class='rank-i'><image src='../../images/20190321162656.png'></image></view>飙升榜 </view>
</view>
<view class='gedan-head'>推荐歌单 ></view>
<view class='ggg' >
<block wx:for="{
{tuijian}}" class='gedan-body'>
<view class='gedan-it' bindtap='tuijianClick' id='{
{index}}'><image src='{
{item}}'></image><view class='lis'><image src='../../images/20190322105830.png'></image>999+</view></view>
</block>
</view>
</view>
js:
//index.js
const app = getApp()
var method='x';
var tid=''
Page({
data: {
indicatorDots: true,
autoplay: true,
interval: 5000,
duration: 1000,
toname:'',
wid:'',
he:'',
lunbo: [],
},
onLoad: function (options) {
var that = this
wx.getSystemInfo({
success: function (res) {
that.setData({ wid: res.windowWidth })
that.setData({ he: res.windowHeight })
},
})
wx.request({
url: 'http://localhost:8080/spider/servlet.do',
data: {
x: 'index',
y: ''
},
header: {
'content-type': 'application/json' // 默认值
},
success(res) {
that.setData({
lunbo: res.data[0].img,
tuijian:res.data[1].tuijianImg
})
}
})
},
submit:function(e){
if (e.detail.value.toname != null && e.detail.value.toname !=""){
method="b"
wx.navigateTo({
url: '/pages/songlist/songlist?me='+ e.detail.value.toname+"&method="+method,
})
}
}
,
xingeClick (){
method='xinge'
wx.navigateTo({
url: '/pages/songlist/songlist?method=' + method,
})
}
, regeClick() {
method = 'rege'
wx.navigateTo({
url: '/pages/songlist/songlist?method=' + method,
})
}
, biaoshengClick() {
method = 'biaosheng'
wx.navigateTo({
url: '/pages/songlist/songlist?method=' + method,