微信小程序-常用api

╰半橙微兮° 2021-11-30 00:54 484阅读 0赞

1.路由5种跳转方式

(1)wx.switchTab :只能跳转到导航页,并关闭其他的导航页

(1)wx.reLaunch :关闭所有页面，打开到应用内的某个页面

(1)wx.redirectTo :关闭当前页面，跳转到应用内的某个页面。但是不允许跳转到 导航 页面

(1)wx.navigateTo :只保留当前页面，跳转到应用内的某个页面。但是不能跳到 tabbar 页面(最多10层)

(1)wx.navigateBack :返回上一页,可以返回多级页面

  1. wx.navigateTo({
  2.     url: 'test?id=1'
  3. })
  5. wx.navigateBack({
  6.     delta: 2
  7. })

2.弹窗提示

  1. (标签)
  2. wx.showToast({
  3. 　　title: '功能暂未开放！',
  4. 　　icon: 'none', success
  5. 　　duration: 2000
  6. })
  7. (选择窗)
  8. wx.showModal({
  9. 　　title: '提示',
  10. 　　content: '这是一个模态弹窗',
  11. 　　success (res) {
  12. 　　　　if (res.confirm) {
  13. 　　　　　　console.log('用户点击确定')
  14. 　　　　} else if (res.cancel) {
  15. 　　　　　　console.log('用户点击取消')
  16. 　　　　}
  17. 　　}
  18. })
  19. (加载中)
  20. wx.showLoading({
  21. 　　title: '加载中',
  22. })
  24. setTimeout(function () {
  25. 　　wx.hideLoading()
  26. }, 2000)

　　

3.分享

  1. onLoad: function (options) {
  2.   this.getDate(options.id)
  3.   wx.showShareMenu({
  4.     // 要求小程序返回分享目标信息
  5.     withShareTicket: true
  6.   })
  7. },
  8. /* 转发*/
  9. onShareAppMessage: function (ops) {
  10.   if (ops.from === 'button') {
  11.     // 来自页面内转发按钮
  12.     console.log(ops.target)
  13.   }
  14.   return {
  15.     title: '转发dom',
  16.     path: `pages/index/index`,
  17.     success: function (res) {
  18.       // 转发成功
  19.       console.log("转发成功:" + JSON.stringify(res));
  20.       var shareTickets = res.shareTickets;
  21.     },
  22.     fail: function (res) {
  23.       // 转发失败
  24.       console.log("转发失败:" + JSON.stringify(res));
  25.     }
  26.   }
  27. }

　　

4.生成canvas图片

  1. var that = this;
  2.     var unit = that.data.screenWidth / 375
  3.     //2. canvas绘制文字和图片
  4.     const ctx = wx.createCanvasContext('share');
  5.     var bgImgPath = that.data.shareImgSrc;
  7.     ctx.drawImage(bgImgPath, 0, 0, 375, 375); //导入图片
  8.     ctx.setFontSize(20)
  9.     ctx.setFillStyle('#000')
  10.     ctx.fillText('生成文字在图片上', 20, 110)
  12.     ctx.stroke()
  13.     ctx.draw(false, function () {
  14.       // 3. canvas画布转成图片
  15.       wx.canvasToTempFilePath({
  16.         x: 0,
  17.         y: 0,
  18.         width: 375,
  19.         height: 375,
  20.         destWidth: 375,
  21.         destHeight: 375,
  22.         canvasId: 'share',
  23.         success: function (res) {
  24.           console.log(res);
  25.           that.setData({
  26.             shareImgSrc: res.tempFilePath
  27.           })
  28.           if (!res.tempFilePath) {
  29.             wx.showModal({
  30.               title: '提示',
  31.               content: '图片绘制中，请稍后重试',
  32.               showCancel: false
  33.             })
  34.           }
  36.         },
  37.         fail: function (res) {
  38.           console.log(res)
  39.         }
  40.       })
  41.     });

　　

5.保存图片到相册

  1. click: function () {
  2.     let that = this
  3.     wx.saveImageToPhotosAlbum({
  4.       filePath: that.data.shareImgSrc,
  5.       success(res) {
  6.         wx.showModal({
  7.           title: '图片保存成功',
  8.           content: '图片成功保存到相册了，去发圈噻~',
  9.           showCancel: false,
  10.           confirmText: '好哒',
  11.           confirmColor: '#72B9C3',
  12.           success: function (res) {
  13.             if (res.confirm) {
  14.               console.log('用户点击确定');
  15.             }
  16.             that.setData({
  17.               canvasHidden: true
  18.             })
  19.           }
  20.         })
  21.       }
  22.     })
  23.   }

　　

6.数据缓存

  1. wx.setStorageSync('key', 'value')
  2.   wx.getStorageSync('key')

　　

7.返回上一页，刷新页面

  1. onShow(){
  2.   this.onLoad()
  3. }

　　

转载于:https://www.cnblogs.com/fm060/p/11014683.html

发表评论

表情：
评论列表 （有 0 条评论，484人围观）

还没有评论，来说两句吧...

相关阅读

    相关 微信小程序常用标签

    1. view 这个标签相当于div(它的特点就是在没有其他样式影响的情况下，宽度100%)； 2. text 这个标签相当于span(它的特点就是在没有其他样式影响的情况

    心已赠人心已赠人/ 0 赞/ 402 阅读