前端
listview.js
var page = 0;
var GetList = function (that) {
that.setData({
hidden: false
});
wx.request({
url: 'https://IP/wechat/index.php',
data: {
type: 'searchcate',
search: that.data.titles,
page: page
},
success: function (res) {
console.log("JSON:" + res.data);
var list = that.data.list;
if (res.data.data[0] == null) {
that.setData({
hiddenitem: true
});
}
if (list.length != 1) {//若果结果只有一条数据,就不刷新
for (var i = 0; i < res.data.data.length; i++) {
list.push(res.data.data[i]);
}
that.setData({
list: list
});
page++;
}
that.setData({
hidden: true
});
}
});
}
Page({
/**
* 页面的初始数据
*/
data: {
titles: '',
list: [],
total: 0,
hidden: true,
scrollTop: 0,
scrollHeight: 0,
hiddenitem: false,
},
btnDetail: function (event) {
wx.navigateTo({
url: '../desc/desc?url=' + event.currentTarget.dataset.hi
})
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
var that = this//不要漏了这句,很重要//在回调函数中貌似不能使用this
wx.getSystemInfo({
success: function (res) {
console.info(res.windowHeight);
that.setData({
scrollHeight: res.windowHeight
});
}
});
this.setData({
titles: options.search//获取url参数
})
console.log(this.data.titles)//获取本页面data数据
},
/**
* 生命周期函数--监听页面初次渲染完成
*/
onReady: function () {
},
/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
var that = this;
GetList(that);
},
bindDownLoad: function () {
var that = this;
GetList(that);
},
scroll: function (event) {
this.setData({
scrollTop: event.detail.scrollTop
});
},
/**
* 生命周期函数--监听页面隐藏
*/
onHide: function () {
},
/**
* 生命周期函数--监听页面卸载
*/
onUnload: function () {
},
/**
* 用户点击右上角分享
*/
onShareAppMessage: function () {
},
})
listview.wxml
<import src="../template/book-item.wxml" />
<view class="container">
<text class="text" hidden="{{!hiddenitem}}" >这本书还在路上……</text>
<view class="flex-wrp" style="height: 300px;flex-direction:column;">
<view class="project-container">
<scroll-view hidden="{{hiddenitem}}" scroll-top="{{scrollTop}}" scroll-y="true" style="height:{{scrollHeight}}px;"
class="list" bindscrolltolower="bindDownLoad" bindscroll="scroll">
<block wx:for="{{list}}" wx:for-item="itemName">
<view class="project-item" bindtap="btnDetail" id="tap" data-hi="{{itemName.url}}">
<template is="bookItem" data="{{itemName}}" />
</view>
</block>
</scroll-view>
</view>
</view>
<view class="body-view">
<loading hidden="{{hidden}}" bindchange="loadingChange">
加载中...
</loading>
</view>
</view>
listview.wxss
.userinfo {
display: flex;
flex-direction: column;
align-items: center;
}
.userinfo-avatar {
width: 128rpx;
height: 128rpx;
margin: 20rpx;
border-radius: 50%;
}
.userinfo-nickname {
color: #aaa;
}
.usermotto {
margin-top: 200px;
}
input {
border: 1px solid #ccc;
}
button::after {
border-radius: unset;
}
.other-button-hover {
background-color: #008300 !important;
color: rgba(255, 255, 255, 0.9) !important;
}
.input-search {
width: 71%;
float: left;
padding: 2px 5px;
border-right: none;
}
.input-btn {
width: 25%;
border-left-width: 0 !important;
border-radius: 0px !important;
padding: 5px 0 0 !important;
}
page {
display: block;
min-height: 100%;
background-color: #fff;
}
.project-container {
margin: 0;
background-color: #fff;
}
.project-item {
background-color: #fff;
font-size: 30rpx;
border-bottom: 1px solid #efeff4;
padding-bottom: 0px;
margin-bottom: 0px;
overflow: hidden;
width:100%;
}
.project-item:last-child {
margin-bottom: 48rpx;
border-bottom: none;
}
.item-head {
height: 80rpx;
line-height: 80rpx;
padding: 0 27rpx 0 0;
overflow: hidden;
}
.post-title-before {
width: 36rpx;
height: 2rpx;
overflow: hidden;
background-color: #d38297;
float: left;
margin-top: 39rpx;
}
.post-title {
height: 50rpx;
line-height: 50rpx;
padding: 0 25rpx;
/**font-size: 26rpx;
color: #D38297;
border: 1px solid #D38297;**/
border-radius: 50rpx;
display: inline-block;
box-sizing: border-box;
vertical-align: middle;
color: #f00;
font-size: 32rpx;
}
.post-title:hover {
background-color: #eee;
}
.project-img {
width: 96px;
height: 120px;
float: left;
padding-right: 8px;
padding-left: 10px;
}
.project-img image {
width: 100%;
height: 100%;
padding-top: 5px;
}
.project-price {
color: #555;
float: right;
height: 42rpx;
line-height: 42rpx;
overflow: hidden;
position: relative;
top: 24rpx;
}
.item-body {
color: #6e6e70;
font-size: 30rpx;
line-height: 42rpx;
padding: 0 16rpx;
min-height: 120px;
}
.project-title {
line-height: 50rpx;
color: #555;
font-size: 30rpx;
font-family: PingFangSC-Medium;
overflow: hidden;
white-space: nowrap;
text-overflow: ellipsis;
}
.project-title .link {
color: #002cc4;
font-size: 26rpx;
white-space: initial;
}
.project-title .link:hover {
background-color: #eee;
}
.project-price label, .project-title label {
color: #aaa;
}
.project-desc {
line-height: 45rpx;
padding: 15rpx 24rpx 5px 6rpx;
/*overflow: hidden;*/
text-overflow: ellipsis;
/*display: -webkit-box;*/
-webkit-line-clamp: 2;
-webkit-box-orient: vertical;
/*max-height: 84rpx;*/
word-break: break-all;
color: #aaa;
min-height: 30px;
}
.project-foot {
padding: 15rpx 0;
line-height: 33rpx;
font-size: 24rpx;
color: #9e9e9e;
overflow: hidden;
}
.bid-num {
float: left;
line-height: 28rpx;
vertical-align: middle;
}
.public-time {
float: right;
margin-right: 10rpx;
line-height: 28rpx;
vertical-align: middle;
}
book-item.wxml
<template name="bookItem">
<view class="item-head" hidden="true">
<!--<view class="post-title"><text>{{itemName.title}}</text></view>-->
</view>
<view class="project-img">
<image src="{{itemName.img}}"></image>
</view>
<view class="item-body">
<view class="post-title"><text>{{itemName.title}}</text></view>
<view class="project-desc">{{itemName.info}}</view>
<view class="project-title" wx:if="{{itemName.review}}"><label>{{itemName.review}}</label></view>
<view class="project-title" wx:if="{{itemName.time}}">距离还书时间还有:<label>{{itemName.time}}</label>天</view>
</view>
</template>
后端
<?php
/**
* Created by PhpStorm.
* User: xubowen
* Date: 2017/5/16
* Time: 上午11:45
*/
require 'api.php';
if(isset($_GET['type'])){
$type=$_GET['type'];
if($type=="search"){
if(isset($_GET['search'])&&isset($_GET['page'])){
$tag=$_GET['search'];
$page=$_GET['page'];
$content=getSearch($tag,$page);
$array=analyseUrl($content);
echo $array;
}else{
echo "请输入search或page参数";
}
}else if($type=="desc"){
if(isset($_GET['url'])){
$url=$_GET['url'];
//不使用自己抓取的数据
//$desc=getDesc($url);
//$array=analyseDesc($desc);
//利用豆瓣api实现
$id=getBookId($url);
$array=getDoubanBook($id);
echo $array;
}else{
echo "请输入url参数";
}
}else if($type=="searchcate"){
if(isset($_GET['search'])&&isset($_GET['page'])){
$tag=$_GET['search'];
$page=$_GET['page'];
$content=getSearchCate($tag,$page);
$array=analyseUrl($content);
echo $array;
}else{
echo "请输入search或page参数";
}
}else{
echo "意图不明确,请输入正确type参数";
}
}else{
echo "意图不明确,请输入type参数";
}