初次提交 1、实现知乎日报列表查看以及详情 2、知乎日报内容html格式解析

app.js

@@ -0,0 +1,32 @@
+App({
+  onLaunch: function () {
+    console.log('App Launch')
+  },
+  onShow: function () {
+    console.log('App Show')
+  },
+  onHide: function () {
+    console.log('App Hide')
+  },
+  getUserInfo:function(cb){
+    var that = this
+    if(this.globalData.userInfo){
+      typeof cb == "function" && cb(this.globalData.userInfo)
+    }else{
+      //调用登录接口
+      wx.login({
+        success: function () {
+          wx.getUserInfo({
+            success: function (res) {
+              that.globalData.userInfo = res.userInfo
+              typeof cb == "function" && cb(that.globalData.userInfo)
+            }
+          })
+        }
+      })
+    }
+  },
+  globalData: {
+    hasLogin: false
+  }
+})

app.json

@@ -0,0 +1,19 @@
+{
+  "pages":[
+      "pages/index/index",
+      "pages/detail/detail"
+  ],
+  "window":{
+    "backgroundTextStyle":"light",
+    "navigationBarBackgroundColor": "#BE304D",
+    "navigationBarTitleText": "知乎日报",
+    "navigationBarTextStyle":"white"
+  },
+  "networkTimeout": {
+    "request": 10000,
+    "connectSocket": 10000,
+    "uploadFile": 10000,
+    "downloadFile": 10000
+  },
+  "debug":true
+}

pages/detail/detail.js

@@ -0,0 +1,52 @@
+// detail.js
+
+//获取应用实例
+var app = getApp()
+
+//require引入文件
+var util = require("../../utils/util.js")
+
+// 引入富文本解析自定义组件
+var WxParse = require('../../wxParse/wxParse.js');
+
+Page({
+
+    //初始化数据
+    data: {
+        title:"",
+        imgsrc:"",
+        wxParseData:""
+    },
+
+    onLoad: function(option){
+        console.log(JSON.stringify(option.id));
+        var that = this
+
+
+        wx.request({
+            url: 'https://news-at.zhihu.com/api/4/news/'+option.id, 
+            header: {
+                'Content-Type': 'application/json'
+            },
+            success: function(res) {
+                console.log(res.data)
+
+                // //html解析
+                // var str = util.coder(res.data.body);
+
+                that.setData({
+                     title:res.data.title,
+                     imgsrc:res.data.image,
+                     wxParseData:WxParse('html',res.data.body)//使用WxParse组件解析html 
+                })
+
+            }
+         })
+
+    }
+
+
+
+
+
+});

pages/detail/detail.json

@@ -0,0 +1,3 @@
+{
+    "navigationBarTitleText": "知乎日报详情"
+  }

pages/detail/detail.wxml

@@ -0,0 +1,16 @@
+
+ <!--引入富文本解析自定义组件-->
+<import src="../../wxParse/wxParse.wxml"/>
+
+
+<view class="container">
+
+
+    <view class="wxParse">
+         <view>{{title}}</view>
+        <image src="{{imgsrc}}"></image>
+
+        <!--知乎内容html解析-->
+        <template is="wxParse" data="{{wxParseData}}"/>
+    </view>
+</view>

pages/detail/detail.wxss

@@ -0,0 +1,2 @@
+/*引入富文本解析自定义组件*/
+@import "../../wxParse/wxParse.wxss";

pages/index/index.js

@@ -0,0 +1,75 @@
+//获取应用实例
+var app = getApp()
+
+// 页面注册
+Page({
+
+    //初始化数据
+    data: {
+        stories:"",
+        top_stories:"",
+        indicatorDots:true,
+        autoplay:true,
+        interval:5000,
+        duration:1000
+    },
+    // 页面跳转-》 知乎日报详情
+    dailyDetail:function(e){
+
+        console.log("**************"+JSON.stringify(e));
+         console.log("**************"+e.target.id);
+
+         wx.navigateTo({
+           url: '../detail/detail?id='+e.target.id,
+           success: function(res){
+             // success
+           },
+           fail: function() {
+             // fail
+           },
+           complete: function() {
+             // complete
+           }
+         })
+
+    },
+
+    //生命周期函数  页面加载 一个页面只会调用一次 
+    onLoad:function(){
+        console.log("onload");
+        var that = this
+        wx.request({
+            url: 'https://news-at.zhihu.com/api/4/news/latest', 
+            header: {
+                'Content-Type': 'application/json'
+            },
+            success: function(res) {
+                console.log(res.data)
+                that.setData({
+                     stories:res.data.stories,
+                     top_stories:res.data.top_stories
+                })
+            }
+         })
+
+    },
+    onReady: function() {
+    // Do something when page ready.
+    },
+    onShow: function() {
+        // Do something when page show.
+
+    },
+    onHide: function() {
+        // Do something when page hide.
+    },
+    onUnload: function() {
+        // Do something when page close.
+    },
+    onPullDownRefresh: function() {
+        // Do something when pull down.
+    },
+    onReachBottom: function() {
+        // Do something when page reach bottom.
+    }
+})

pages/index/index.wxml

@@ -0,0 +1,21 @@
+<view class="container">
+
+    <!--banner滑动-->
+    <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}}">
+        <block wx:for="{{top_stories}}">
+            <swiper-item>
+                <image id="{{item.id}}" bindtap="dailyDetail" src="{{item.image}}" class="slide-image" width="355" height="150"/>
+                <view>{{item.title}}</view>
+            </swiper-item>
+        </block>
+    </swiper>
+
+    <!--最新知乎日报列表-->
+    <view class="main">
+        <block wx:for="{{stories}}">
+                 <view> {{item.title}}</view>
+                 <image id="{{item.id}}" bindtap="dailyDetail" src="{{item.images[0]}}"></image>
+        </block>
+    </view>
+
+</view>

pages/index/index.wxss

@@ -0,0 +1,7 @@
+
+/*index style*/
+
+
+.slide-image{
+    height: 100px;
+}

pages/portal/portal.js

@@ -0,0 +1,56 @@
+//获取应用实例
+var app = getApp()
+
+Page({
+
+    //初始化数据
+    data: {
+        imgsrc:"",
+        desc:""
+    },
+    enterIndex:function(){
+        wx.redirectTo({
+            url: '../index/index'
+        })
+    },
+
+    //生命周期函数
+    onLoad:function(){
+        console.log("onload");
+        var that = this
+        wx.request({
+            url: 'https://news-at.zhihu.com/api/4/start-image/1080*1776', 
+            header: {
+                'Content-Type': 'application/json'
+            },
+            success: function(res) {
+                console.log(res.data)
+                that.setData({
+                    imgsrc:res.data.img,
+                    desc:res.data.text
+                })
+
+            }
+         })
+
+    },
+    onReady: function() {
+    // Do something when page ready.
+    },
+    onShow: function() {
+        // Do something when page show.
+
+    },
+    onHide: function() {
+        // Do something when page hide.
+    },
+    onUnload: function() {
+        // Do something when page close.
+    },
+    onPullDownRefresh: function() {
+        // Do something when pull down.
+    },
+    onReachBottom: function() {
+        // Do something when page reach bottom.
+    }
+})

pages/portal/portal.json

@@ -0,0 +1,4 @@
+{
+
+    "navigationBarTitleText": "启动页"
+  }

pages/portal/portal.wxml

@@ -0,0 +1,9 @@
+<view class="container">
+
+    <view class="pic_desc">{{desc}}</view>
+    <button bindtap="enterIndex">立即进入</button>
+
+    <image src="{{imgsrc}}"></image>
+
+
+<view>

utils/util.js

@@ -0,0 +1,22 @@
+// util.js   封装常用公共方法
+
+// js解析html标签
+function coder(str) {
+    var s = "";
+    if (str.length == 0) return "";
+    for (var i = 0; i < str.length; i++) {
+        switch (str.substr(i, 1)) {
+            case "<": s += "&lt;"; break;
+            case ">": s += "&gt;"; break;
+            case "&": s += "&amp;"; break;
+            case " ": s += "&nbsp;"; break;
+            case "\"": s += "&quot;"; break;
+            default: s += str.substr(i, 1); break;
+        }
+    }
+    return s;
+}
+
+
+//输出coder方法  在其他地方可以调用该方法
+module.exports = {coder}