微信小程序开发经验总结(二)

微信小程序开发经验总结

微信小程序开发经验总结(一)
微信小程序开发经验总结(二)
微信小程序开发经验总结(三)
微信小程序开发经验总结(四)
微信小程序开发经验总结(五)
微信小程序开发经验总结(六)
微信小程序开发经验总结(七)

4. page.json

• 页面的.json只能设置 window 相关的配置项，以决定本页面的窗口表现，所以无需写 window 这个键

  {
    "navigationBarTitleText": "我的"
  }

5. page跳转

• navigateTo, redirectTo 只能打开非 tabBar 页面。

• switchTab 只能打开 tabBar 页面

• reLaunch 可以打开任意页面。

• 页面底部的 tabBar 由页面决定，即只要是定义为 tabBar 的页面，底部都有 tabBar。

• 调用页面路由带的参数可以在目标页面的onLoad中获取。

• 一个应用同时只能打开5个页面，当已经打开了5个页面之后，wx.navigateTo不能正常打开新页面。请避免多层级的交互方式，或者使用wx.redirectTo

• 跳转实例

  //保留当前页面，跳转到应用内的某个页面
  wx.navigateTo({
     url: '../second/second?key1=value1&key2=value2'//实际路径要写全
  })
  //关闭当前页面，跳转到应用内的某个页面。
  wx.redirectTo(OBJECT)
  //关闭所有页面，跳转到应用内的某个页面。
  wx.reLaunch(OBJECT) 
  //打开 tabBar 页面
  wx.switchTab({
  url: '/index'//路径后不能带参数
  })
  //返回
  wx.navigateBack({ 
  delta: 2//delta Number  1   返回的页面数，如果 delta 大于现有页面数，则返回到首页。
  })

6. page之间的传值

• first.js ==> second.js(打开页面并传值):url 尾部加上?key1=value1&key2=value2,在onLoad接收

  //A页面跳转B页面
  //first.js
   second: function () {
    wx.navigateTo({
      url: '../second/second?key1=value1&key2=value2'//实际路径要写全
    })
  }
  //second.js
  onLoad: function (options) {
    console.log(options.key1)
  },

• second.js ==> first.js(关闭页面并回传值):getCurrentPages()获取上一页,通过setData({})传值

  //A页面跳转B页面之后返回
  var that=this;
  var pages=getCurrentPages();
  //当前页面
  var currPage = pages[pages.length - 1]; 
  //上一页     
  var lastPage =pages[pages.length-2];     
  直接调用上一个页面的setData()方法，把数据存到上一个页面中去
  lastPage.setData(       
  {         
    key: value       
  }     
  )     
  //返回     
  wx.navigateBack({   
  });