获取知乎日报每日消息

1 知乎日报api
https://github.com/izzyleung/ZhihuDailyPurify/wiki/知乎日报-API-分析
2小程序代码部分，需要创建一个展示页面，一个js，没有添加样式文件。用到了3个组件导航组件navigator和基础组件text以及媒体组件image

1）index.wxml

<!--index.wxml-->
<view class="container"> 
  <block wx:for="{{list}}" wx:for-index="id" wx:key="*this">
  <text wx:if="{{item.header}}">{{item.header}}</text>
  <navigator wx:else url="../detail/detail?id={{item.id}}">
    <view>
      <view>
        <text>{{item.title}}</text>
      </view>
      <view>
        <image src="{{item.images[0]}}" class="news-image"/>
      </view>
    </view>
  </navigator>
  </block>
</view>

2)index.js
该文件通过onLoad初始化获取日报数据，navigate绑定的事件用于链接跳转（未完成），

//index.js
//获取应用实例
const app = getApp()
var utils = require('../../utils/util.js')
Page({
  data: {
    list:[],
  },
  //事件处理函数
  bindViewTap: function() {
    wx.navigateTo({
      url: '../detail/detail?id=' + e.target.dataset.id
    })
  },
  onLoad: function () {
    let that = this;
    wx.request({
      url: 'http://news-at.zhihu.com/api/4/news/latest',
      headers:{
        'Content-Type':'applicantion/json'
      },
      success(res){
        that.setData({
          list:[{header:'今日新闻'}].concat(res.data.stories)
        })
      }
    })
    this.index=1;
  },

})

3展示效果如下

屏幕快照 2018-06-24 下午11.25.15.png
4使用block标签时遇到一个警告warning： Now you can provide attr "wx:key" for a "wx:for" to improve performance.具体解决方式请看链接
微信小程序 wx:key