微信小程序 一些总结

个人博客：个人博客

1、跳转

   <navigator url=""></navigator>

    js

wx.navigateTo(OBJECT)

wx.redirectTo(OBJECT)

2、加载loading

  (1)、<loading hidden="{{loadding}}">正在加载</loading>

         然后在js文件中控制  loadding 是否关闭

   (2)、wx.showLoading({

            title: '玩命加载中',

    })

      wx.hideLoading();

3、获取url参数

    在onLoad 方法中 options对象保存

     

4、promise/post封装

     

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41

const wxPromisify = fn => {     return function(obj = {}) {         return new Promise((resolve, reject) => {             obj.success = function(res) {                 resolve(res)             }             obj.fail = function(res) {                 reject(res)             }             fn(obj)         })     } } // 封装post请求 const post = (url, data) => {     var promise = new Promise((resolve, reject) => {         //网络请求         wx.request({             url: url,             data: data,             method: 'POST',             success: function(res) { //服务器返回数据                 if (res.data.code == 1) {                     resolve(res);                 } else { //返回错误提示信息                     reject(res.data);                 }             },             error: function(e) {                 reject('网络出错');             }         })     });     return promise; } module.exports = {     wxPromisify: wxPromisify,     post: post } 引用的时候 const { wxPromisify, post } = require('../../utils/promisfn.js')

5、回到顶部

     //js

1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28

data: {         floorstatus: false, //回到顶部是否存在     },     // 获取滚动条当前位置     onPageScroll: function(e) {         if (e.scrollTop > 100) {             this.setData({                 floorstatus: true             });         } else {             this.setData({                 floorstatus: false             });         }     },     //回到顶部     goTop: function(e) { // 一键回到顶部         if (wx.pageScrollTo) {             wx.pageScrollTo({                 scrollTop: 0             })         } else {             wx.showModal({                 title: '提示',                 content: '当前微信版本过低，无法使用该功能，请升级到最新微信版本后重试。'             })         }     },

//wxml

1	<image src='../../assets/img/top.png' class='goTop' hidden='{{!floorstatus}}' bindtap="goTop"></image>

//wxss 这些公用的可以放到app.wxss

1 2 3 4 5 6 7 8

.goTop {     height: 80rpx;     width: 80rpx;     position: fixed;     bottom: 50rpx;     right: 30rpx;     border-radius: 50%; }

6、文章富文本解析wxParse

     wxParse

7、服务器必须是https，包括图片，还有就是背景图不能使用本地资源图片，你可以使用服务器的，或者是base64