微信小程序教程笔记6

微信小程序的页面周期和参数绑定

<!--index.wxml-->
<view class="container">
<navigator url="../logs/logs?id=100" redirect>
 <view>
 <!--<view bindtap="click1">--> 
    <text class="user-motto">文章1</text>
  </view>
</navigator>
  <view>
    <text class="user-motto">文章2</text>
  </view>

  <view>
    <text class="user-motto">文章2</text>
  </view>

  <view>
    <text class="user-motto">文章4</text>
  </view>
</view>

//index.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    console.log("--index page OnLoad--");
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    console.log("--index page OnReady--");
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    console.log("--index page Onshow--");
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
    console.log("--index page OnHide--");
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    console.log("--index page OnUnLoad--");
  },
  /**
   * click1 event handle
   */
  click1:function(){
    wx.navigateTo({
      url: '../logs/logs?id=1',
    })
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {
    
  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {
    
  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {
    
  }
})

<!--logs.wxml-->
<view class="container log-list">
  这里使文章详细内容...当前的文章id为：{{articleId}}
</view>

//logs.js
Page({

  /**
   * 页面的初始数据
   */
  data: {
    articleId:null
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
    console.log("--logs page OnLoad--");
    console.log(options)
    this.setData({articleId:options.id})
  },

  /**
   * 生命周期函数--监听页面初次渲染完成
   */
  onReady: function () {
    console.log("--logs page OnReady--");
  },

  /**
   * 生命周期函数--监听页面显示
   */
  onShow: function () {
    console.log("--logs page Onshow--");
  },

  /**
   * 生命周期函数--监听页面隐藏
   */
  onHide: function () {
    console.log("--logs page OnHide--");
  },

  /**
   * 生命周期函数--监听页面卸载
   */
  onUnload: function () {
    console.log("--logs page OnUnLoad--");
  },

  /**
   * 页面相关事件处理函数--监听用户下拉动作
   */
  onPullDownRefresh: function () {

  },

  /**
   * 页面上拉触底事件的处理函数
   */
  onReachBottom: function () {

  },

  /**
   * 用户点击右上角分享
   */
  onShareAppMessage: function () {

  }
})