Browse Source

Optimize page jumps

chinadelu 5 years ago
parent
commit
0f10f8a635

+ 5 - 0
component/search/search.wxml

@@ -1,3 +1,8 @@
+<!-- 
+  这是一个简单的组件结构,没有使用插槽等复杂组件使用的属性
+  可以通过一个简单的组件入门组件化
+ -->
+
 <view class="search marginTopBottom" bindtap="goToSearch">
   <text class="icon-search"></text>
   <view class="search-item">搜索你想听的节目</view>

+ 0 - 6
pages/collection/collection.js

@@ -33,12 +33,6 @@ Page({
     }
   },
 
-  /**
-   * 生命周期函数--监听页面显示
-   */
-  onShow: function () {
-
-  },
 
   /**
    * 用户点击右上角分享

+ 61 - 89
pages/details/details.js

@@ -4,15 +4,54 @@ Page({
    * 页面的初始数据
    */
   data: {
-    performance:[
-      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
-      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
-      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
-      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
-      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
-      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
-      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
-      {name:"《人在江湖》郭德纲 于谦",year:"2年前",count:"5601.9万",time:"34:36"},
+    performance: [{
+        name: "《人在江湖》郭德纲 于谦",
+        year: "2年前",
+        count: "5601.9万",
+        time: "34:36"
+      },
+      {
+        name: "《人在江湖》郭德纲 于谦",
+        year: "2年前",
+        count: "5601.9万",
+        time: "34:36"
+      },
+      {
+        name: "《人在江湖》郭德纲 于谦",
+        year: "2年前",
+        count: "5601.9万",
+        time: "34:36"
+      },
+      {
+        name: "《人在江湖》郭德纲 于谦",
+        year: "2年前",
+        count: "5601.9万",
+        time: "34:36"
+      },
+      {
+        name: "《人在江湖》郭德纲 于谦",
+        year: "2年前",
+        count: "5601.9万",
+        time: "34:36"
+      },
+      {
+        name: "《人在江湖》郭德纲 于谦",
+        year: "2年前",
+        count: "5601.9万",
+        time: "34:36"
+      },
+      {
+        name: "《人在江湖》郭德纲 于谦",
+        year: "2年前",
+        count: "5601.9万",
+        time: "34:36"
+      },
+      {
+        name: "《人在江湖》郭德纲 于谦",
+        year: "2年前",
+        count: "5601.9万",
+        time: "34:36"
+      },
     ]
   },
 
@@ -20,93 +59,26 @@ Page({
    * 生命周期函数--监听页面加载
    */
 
-  
-  onLoad: function (options) {
-    console.log(options.value)
-    if(options.value == 1){
-      this.setData({
-        performanceInfo:[{
-          imgurl:"../../image/guess1.jpg",
-          title:"米小圈上学记:一二三年级",
-          author:"米小圈",
-          num1: "767.6万",
-          num2:"257"
-        }],
-        imgurl:"../../image/guess1.jpg",
-      });
-    }
-    if(options.value == 2){
-      this.setData({
-        performanceInfo:[{
-          imgurl:"../../image/guess2.jpg",
-          title:"段子来了",
-          author:"段子来了",
-          num1: "767.6万",
-          num2:"257"
-        }],
-        imgurl:"../../image/guess2.jpg",
-      });
-    }
-    if(options.value == 3){
-      this.setData({
-        performanceInfo:[{
-          imgurl:"../../image/guess3.jpg",
-          title:"读者",
-          author:"读者",
-          num1: "767.6万",
-          num2:"257"
-        }],
-        imgurl:"../../image/guess3.jpg",
-      });
-    }
-  },
 
-  /**
-   * 生命周期函数--监听页面初次渲染完成
-   */
-  onReady: function () {
-    
-  },
-
-  /**
-   * 生命周期函数--监听页面显示
-   */
-  onShow: function () {
-    
-  },
-
-  /**
-   * 生命周期函数--监听页面隐藏
-   */
-  onHide: function () {
-    
-  },
-
-  /**
-   * 生命周期函数--监听页面卸载
-   */
-  onUnload: function () {
-    
-  },
-
-  /**
-   * 页面相关事件处理函数--监听用户下拉动作
-   */
-  onPullDownRefresh: function () {
-    
+  onLoad: function (options) {
+    console.log(options)
+    this.setData({
+      performanceInfo: [{
+        imgurl: options.url+'=5&upload_type=album&device_type=ios&name=medium&magick=png',
+        title: options.title,
+        author: "某某某",
+        num1: "767.6万",
+        num2: "257"
+      }],
+      imgurl: options.url+'=5&upload_type=album&device_type=ios&name=medium&magick=png',
+    });
   },
 
-  /**
-   * 页面上拉触底事件的处理函数
-   */
-  onReachBottom: function () {
-    
-  },
 
   /**
    * 用户点击右上角分享
    */
   onShareAppMessage: function () {
-    
+
   }
 })

+ 5 - 0
pages/details/details.wxss

@@ -43,6 +43,11 @@
 .themetitle {
   color: #fff;
   font-size: 40rpx;
+  display: -webkit-box;
+  -webkit-line-clamp: 2;/*行数n*/
+  -webkit-box-orient: vertical; 
+  overflow: hidden;
+  text-overflow: ellipsis;
 }
 
 .themeauthor {

+ 6 - 4
pages/index/index.js

@@ -50,7 +50,7 @@ Page({
         if(result.statusCode == 200){
           that.setData({
             showitem:true,
-            // guess:result.data.guess.list[0].list,
+            guess:result.data.paidArea.list,
             xiaoshuocontent:result.data.hotRecommends.list[0].list,
             xiangshengcontent:result.data.hotRecommends.list[2].list,
             tuokocontent:result.data.hotRecommends.list[4].list
@@ -69,9 +69,11 @@ Page({
     })
   },
   gotoDetails(e){
-    var id = e.currentTarget.dataset.id;
+    // console.log(e)
+    var url = e.currentTarget.dataset.coverimg;
+    var title = e.currentTarget.dataset.title;
     wx.navigateTo({
-      url: '/pages/details/details?value='+id,
+      url: '/pages/details/details?url='+url+'&title='+title,
     })
   }
-})
+})

+ 6 - 24
pages/index/index.wxml

@@ -47,33 +47,15 @@
   </view>
   <!-- 这没有没有使用数据绑定,因为是练手而且数据比较少 -->
   <view class="likeItemBox">
-    <view class="likeItem" bindtap="gotoDetails" data-id="1">
+    <view class="likeItem" bindtap="gotoDetails" data-coverImg="{{item.coverMiddle}}" data-title="{{item.intro}}" wx:for="{{guess}}" wx:key="{{index}}">
       <view class="likeimg">
-        <image class="likeItemIcon" src="/image/guess1.jpg" mode="widthFix"></image>
+        <image class="likeItemIcon" src="{{item.coverMiddle}}" mode="widthFix"></image>
         <view class="likecover">
           <!-- text用来显示icon  暂无 -->
           <text class=""></text> 4.6亿
         </view>
       </view>
-      <view class="likeText">米小圈上学记:一二三年级</view>
-    </view>
-    <view class="likeItem" bindtap="gotoDetails" data-id="2">
-      <view class="likeimg">
-        <image class="likeItemIcon" src="/image/guess2.jpg" mode="widthFix"></image>
-        <view class="likecover">
-          <text class=""></text> 4.6亿
-        </view>
-      </view>
-      <view class="likeText">段子来了</view>
-    </view>
-    <view class="likeItem" bindtap="gotoDetails" data-id="3">
-      <view class="likeimg">
-        <image class="likeItemIcon" src="/image/guess3.jpg" mode="widthFix"></image>
-        <view class="likecover">
-          <text class=""></text> 4.6亿
-        </view>
-      </view>
-      <view class="likeText">读者</view>
+      <view class="likeText">{{item.intro}}</view>
     </view>
   </view>
 </view>
@@ -87,7 +69,7 @@
       <view class="Title-right">查看全部></view>
     </view>
     <block wx:for="{{xiaoshuocontent}}" wx:key="index">
-      <view class="content">
+      <view class="content" bindtap="gotoDetails" data-coverImg="{{item.albumCoverUrl290}}" data-title="{{item.title}}">
         <view class="contentImg">
           <image src="{{item.albumCoverUrl290}}" mode="widthFix"></image>
         </view>
@@ -114,7 +96,7 @@
       <view class="Title-right">查看全部></view>
     </view>
     <block wx:for="{{xiangshengcontent}}" wx:key="index">
-      <view class="content">
+      <view class="content" bindtap="gotoDetails" data-coverImg="{{item.albumCoverUrl290}}" data-title="{{item.title}}">
         <view class="contentImg">
           <image src="{{item.albumCoverUrl290}}" mode="widthFix"></image>
         </view>
@@ -141,7 +123,7 @@
       <view class="Title-right">查看全部></view>
     </view>
     <block wx:for="{{tuokocontent}}" wx:key="index">
-      <view class="content">
+      <view class="content" bindtap="gotoDetails" data-coverImg="{{item.albumCoverUrl290}}" data-title="{{item.title}}">
         <view class="contentImg">
           <image src="{{item.albumCoverUrl290}}" mode="widthFix" lazy-load="false"></image>
         </view>

+ 1 - 1
pages/index/index.wxss

@@ -104,7 +104,7 @@
 .likeText{
   font-size: 28rpx;
   color: #333;
-  padding: 20rpx 0rpx;
+  margin-top: 10rpx;
   display: -webkit-box;
   -webkit-line-clamp: 2;/*行数n*/
   -webkit-box-orient: vertical; 

+ 0 - 42
pages/search/search.js

@@ -22,48 +22,6 @@ Page({
 
   },
 
-  /**
-   * 生命周期函数--监听页面初次渲染完成
-   */
-  onReady: function () {
-
-  },
-
-  /**
-   * 生命周期函数--监听页面显示
-   */
-  onShow: function () {
-
-  },
-
-  /**
-   * 生命周期函数--监听页面隐藏
-   */
-  onHide: function () {
-
-  },
-
-  /**
-   * 生命周期函数--监听页面卸载
-   */
-  onUnload: function () {
-
-  },
-
-  /**
-   * 页面相关事件处理函数--监听用户下拉动作
-   */
-  onPullDownRefresh: function () {
-
-  },
-
-  /**
-   * 页面上拉触底事件的处理函数
-   */
-  onReachBottom: function () {
-
-  },
-
   /**
    * 用户点击右上角分享
    */

+ 2 - 2
utils/utils.js

@@ -12,9 +12,9 @@ let myRequest = function(url,methods,data = {}){
         success: (result)=>{
           console.log(result);
           if(result.statusCode == 200){
-              //
+              // TODO
           }else{
-            //
+            // TODO
           }
         },
     })