小程序开发经验总结

获取到接口文章内容的处理方案

/**

 * html编码转义

 */

function htmlDecodeByRegExp(str) {
   var s = "";
   if (str.length == 0) return "";
       s = str.replace(/&/g, "&");
       s = s.replace(/</g, "<");
       s = s.replace(/>/g, ">");
       s = s.replace(/ /g, " ");
       s = s.replace(/'/g, "'");
       s = s.replace(/"/g, """);
       return s;

}

/**
 * 将文章详情图设置为宽度百分比，处理文章详情图片过大导致无法完整显示
 */
function handleContentImg (content){
    var rel = /styles*?=s*?([‘"])[sS]*?/gi;
    content = content.replace(rel, '');
    content = content.replace(/<img/gi, '<img style="max-width:100%!important;height:auto!important" ');
    return content;
}

// 开始对文章内容进行处理
var content = common.htmlDecodeByRegExp(res.data.details);
content = common.handleContentImg(content);

// 通过setData的方式将content设置为nodes,放入标签内即可
 <rich-text nodes="{{nodes}}"></rich-text>

 

自定义组件获取元素的方式

// 这里与常规的获取方式有些出入：
const query = wx.createSelectorQuery().in(this)
 query.select('.text').boundingClientRect(function (rect) {
      console.log(rect)                         
}).exec();

 

当需要往组件传一些异步的值时，可以在组件引用的外层加一个block标签，用wx:if判断是否结束计算，已结束才会引用这个组件

<block wx:if="{{isEndComputer}}">
    <shoppingcart alllist="{{alllist}}" barH="{{barH}}" bindsettlement='settlement' bindupdateList='updateList'></shoppingcart>
</block>

 

使用微信的redirectTo进行跳转时，左上角还存在返回箭头

A界面使用了navigateTo跳转到了B界面，此时B界面还使用redirectTo返回其他界面时，就会出现这种情况

解决方案：B界面不要使用redirectTo，而是换成wx.reLaunch

 

使用scroll-view时官方的下拉刷新demo

https://developers.weixin.qq.com/s/D9XH0vmM79ij

 

自定义方法中使用promise

return new Promise((resolve,reject)=>{
         app.httpPost({
            url:  'xxx',
            data: params,
            loading: true,
            loadingMsg: '加载中'
         }).then((res) => {
            if(res.code==200) {
               that.setData({
                  safeguardInfo: res.data 
               })
               wx.setStorageSync("safeguardInfo", res.data);
               resolve('success')
            }
         }).catch(e => {  
            reject('fail')
            console.log(e);  
         })  
  })

 

promise all的使用

let promise1 = new Promise(function (resolve, reject) {
      query.select('.top').boundingClientRect(function (rect) {
         // console.log(rect.width)
         var boxTop = rect.height + app.globalData.navBarHeight;
         resolve(boxTop);
      }).exec();
    });

    let promise2 = new Promise(function (resolve, reject) {
      query.select('.bottomBar').boundingClientRect(function (rect) {
         // console.log(rect.width)
         var bottomH = rect.height ;
         resolve(bottomH);
       
      }).exec();
    });

    Promise.all([
      promise1, promise2
    ]).then(res => {
    
      console.log('promise-all')
      console.log(res[0])
      console.log(res[1])
  })		

 

解决跳转传参时,参数过大而导致丢失的情况

wx.navigateTo({

   url: '/sqtg_sun/pages/test/xxx/xxxx+ '?dataAry=' + encodeURIComponent(JSON.stringify(dataAry)) 

})

 

传递过后使用以下方式解析

var dataAry = JSON.parse(decodeURIComponent(options.dataAry));

 

获取用户手机号

https://www.cnblogs.com/mica/p/10550840.html