微信小程序开发vlog

1:图片预览  

   wx.previewImage();

                            data-src必需为网络（http）链接，小程序内部图片在ios系统下无法显示；

                             文档链接：https://developers.weixin.qq.com/miniprogram/dev/api/wx.previewImage.html

                             示例：

                             wxml: 

                             js:

  previewImage: function (e) {
    var current = e.target.dataset.src;
    if (current){
      wx.previewImage({
        current: current,
        urls: [current],
      })
    }
  },

2：有关自定义组件

 如果多个页面都有运用到此组件，可直接在app.json内注册，这样可以直接运用于多个页面：

  "usingComponents": {
    "kefu": "/components/kefu/kefu"
  }

3:页面的跳转(路由)

文档见：https://developers.weixin.qq.com/miniprogram/dev/api/wx.switchTab.html

tabbar页面是指：

     app.json内"tabBar":{}内注册的页面

 App.WxService.navigateTo(url，{所带参数})

  navigateTo(e) {
    App.WxService.navigateTo('/pages/details/details', {
      id: e.currentTarget.dataset.id,
    })
  },

wx.switchTab(Object object):跳至tabbar页面，路径后不能带参数  ，并关闭其他所有非 tabBar 页面

 

    wx.switchTab({
      url: '/pages/details/details',
      success(res) {
        console.log('跳转成功')
      },
      fail(res) {
        console.log('失败')

      },
      complete(res) {
        console.log('完成')

      },
    })

                        

wx.reLaunch(Object object):跳至非tabbar页面，关闭所有页面；

wx.reLaunch({
  url: 'test?id=1'
})

wx.redirectTo(Object object):跳至非tabbar页面，关闭当前页面

wx.redirectTo({
  url: 'test?id=1'
})

wx.navigateTo(Object object)：保留当前(最多10层)，页面会被加入栈堆（页面数据保留不被删除），跳至非tabbar页面

  navigateTo(e) {
    wx.navigateTo({
     url: '/pages/details/details?id='+e.currentTarget.dataset.id,
    })
  },

wx.navigateBack(Object object)：关闭当前页面，返回上一页面或多级页面。可通过 getCurrentPages 获取当前的页面栈，决定需要返回几层。

var pages = getCurrentPages， //获取页面栈
     currpage = pages[pages.length - 1], //当前页面
     prevPage = pages[pages.length - 2]; //上一个页面（父页面）
prevPage.setData({
    id : id
})  // 对上一个页面直接调用setData进行数据修改绑定

// 注意：调用 navigateTo 跳转时，调用该方法的页面会被加入堆栈，而 redirectTo 方法则不会。见下方示例代码

// 此处是A页面
wx.navigateTo({
  url: 'B?id=1'
})

// 此处是B页面
wx.navigateTo({
  url: 'C?id=1'
})

// 在C页面内 navigateBack，将返回A页面
wx.navigateBack({
  delta: 2
})