微信小程序仿知乎日报demo

微信小程序仿知乎日报demo，数据直接用的知乎，做起来不难，做个参考吧！

app.json

{
  "pages":[
    "pages/index/index",
    "pages/theme/theme",
    "pages/detail/detail",
    "pages/list/list"
  ],
  "window":{
    "backgroundTextStyle":"light",
    "navigationBarBackgroundColor": "#00a2ea",
    "navigationBarTitleText": "知乎日报",
    "navigationBarTextStyle": "white"
  },
  "tabBar": {
    "color": "#353535",
    "selectedColor": "#3cc51f",
    "borderStyle": "white",
    "backgroundColor": "#ffffff",
    "list": [{
      "pagePath": "pages/index/index",
      "iconPath": "images/icon_API.png",
      "selectedIconPath": "images/icon_API_HL.png",
      "text": "主页"
    }, {
      "pagePath": "pages/theme/theme",
      "iconPath": "images/icon_component.png",
      "selectedIconPath": "images/icon_component_HL.png",
      "text": "主题日报"
    }]
  },
  "networkTimeout": {
    "request": 120000
  }
}

detail.js

Page({
  data: {
    art: {}
  },
  onReady: function () {
    wx.setNavigationBarTitle({
      title: '详情页面'
    })
  },
  onLoad: function (options) {
    var that = this
    wx.request({
      url: 'http://news-at.zhihu.com/api/4/news/' + options.id,
      headers: {
        'Content-Type': 'application/json'
      },
      success: function (res) {
         that.setData({
           art: res.data
         })
         console.log(res.data)
      }
    })
  }
})

list.js

Page({
  data: {
    list: {}
  },
  onReady: function () {
    wx.setNavigationBarTitle({
      title: this.title
    })
  },
  onLoad: function (options) {
    var that = this
    this.title = options.title
    wx.request({
      url: 'http://news-at.zhihu.com/api/4/theme/' + options.id,
      headers: {
        'Content-Type': 'application/json'
      },
      success: function (res) {
         that.setData({
           list: res.data.stories
         })
         console.log(res.data)
      }
    })
  }
})

theme.js

Page({
    data: {
      list: []
    },
    onLoad: function () {
      var that = this
      wx.request({
        url: 'http://news-at.zhihu.com/api/4/themes',
        headers: {
          'Content-Type': 'application/json'
        },
        success: function (res) {
          that.setData({
            list: res.data.others
          })
        }
      })
    }
})

大家可以拿代码自己跑下

这里有一个小程序资源的集合包，内容很多，需要可以下载下

http://www.taomadao.com/thread-556-1-1.html

转载于:https://my.oschina.net/u/2286687/blog/801796