小程序学习之旅---跳转传值，请求接口，图片显示，页面传值到详情页来获取内容

<view class='content'>

   <view class='warp' wx:for="{{list}}" wx:for-item='item' wx:key='{{index}}'>
        <view class='h2'>{{item.title}}</view>

        <view class='list'>
          <view class='item' wx:for="{{item.list}}" wx:for-item="food" wx:key='{{food._id}}'> 
            <!--<image src='{{host}}{{food.img_url}}'></image>-->
              <text>{{food.title}}</text>
          </view>

        </view>
    
    </view>

</view>

// pages/food/food.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    list: [],
    host: 'http://a.itying.com/'
  },
  goFoodContent (e) {
    console.log(e.target.dataset.aid)
    var aid = e.target.dataset.aid
    wx.navigateTo({
      url: '../foodcontent/foodcontent?aid=' + aid,
      success: (result) => {

      },
      fail: () => { },
      complete: () => { }
    });
  },
  requestData () {
    var that = this;
    wx.request({
      url: 'http://a.itying.com/api/productlist', //仅为示例，并非真实的接口地址
      data: {
      },
      header: {
        'content-type': 'application/json' // 默认值
      },
      success: function (res) {
        console.log(res.data);
        //用到this要注意this指向
        that.setData({
          list: res.data.result
        })
      }
    })

  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    // 获取上个页面传过来的值
    console.log(options)
    this.requestData();
  }
})

传值到详情页

// pages/foodcontent/foodcontent.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    list: [],
    host: 'http://a.itying.com/'
  },
  requestData (id) {
    var id = id
    console.log(id)
    var that = this;
    var api = 'http://a.itying.com/api/productcontent?id=' + id;
    wx.request({
      url: api, //仅为示例，并非真实的接口地址     
      header: {
        'content-type': 'application/json' // 默认值
      },
      success: function (res) {
        var data = res.data.result[0];
        data.img_url = data.img_url.replace(/\\/g, '/');
        that.setData({
          list: data
        })
      }
    })
  },
  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    //获取上一个页面的传值
    console.log(options)
    var id = options.id
    this.requestData(id)
  }
})

详情页展示

<view class='p_img'>
  <image src='{{host}}{{list.img_url}}'></image>
</view>
<view class='h2'>
  {{list.title}}
</view>
<view class='content'>
  {{list.content}}
</view>