• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

搞小程序遇到的问题及解决方案(持续更新)

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

 

1、关于页面尺寸问题:设计稿使用设备宽度750px比较容易计算,750px的话1rpx=1px,这样的话,设计图上量出来的尺寸是多少px就是多少rpx,不用太费力换算,对开发比较友好。

2、在页面初始化时,我们要调用接口获取数据,这时我们要将获取到的数据挂载在全局data下,光比如,光用 this.data  = res,这样数据肯定是挂不上的,要调用小程序的特定方法才行,如下

this.setData({
  data:res
})

 

 3、微信小程序 scroll-view在安卓手机上可能会出现滚动条的情况,可通过如下样式解决:

::-webkit-scrollbar{
  width:0;
  height: 0;
  color:transparent;
}
或者
::-webkit-scrollbar{
  display:none;
}

4、关于小程序兼容性问题,要多在开发者工具中切换不同机型进行查看页面布局问题。

 

5、封装promise请求

function getRequest(url, data) {
  var getRequest = wxPromisify(wx.request);
  return getRequest({
    url: url,
    method: \'GET\',
    data: data,
    header: {
      \'Content-Type\': \'application/json\'
    }
  })
}
function wxPromisify(fn) {
  return function (obj = {}) {
    return new Promise((resolve, reject) => {
      obj.success = function (res) {
        if (isHttpSuccess(res.statusCode)) {
          //成功
          resolve(res)
        } else {
          reject(res)
        }
      }
      obj.fail = function (res) {
        //失败
        reject(res)
      }
      fn(obj)
    })
  }
}

6、组件式写法,之前项目的写法是用include把其他模块的 xml ,引到index.xml,css 也是import到 index.wxss,然后关于各个模块的操作代码就全部都堆积到了 index.js。其实可以在这基础上优化,但是还是不够优雅。

{这里顺便说下 WXML提供两种文件引用方式import和include。

import可以在该文件中使用目标文件定义的template。

import有作用域的概念,即只会import目标文件中定义的template,而不会import目标文件import的template。

如:C import B,B import A,在C中可以使用B定义的template,在B中可以使用A定义的template,但是C不能使用A定义的template

而include,include可以将目标文件除了<template/>的整个代码引入,相当于是拷贝到include位置。}

 

后来,决定改下,改成组件式写法,就是页面分成诸多带有各自业务逻辑的子组件。

代码结构就是 components 下 带有多个子目录,各个字目录下新建Component,这是开发工具会自动创建子组件需要的文件,如

js里面就可以写关于该组件的业务逻辑,wxss写样式即可,同时需要在父级的json文件中引用该子组件,如

 

然后在index.xml引用即可 ,如<a></a>,当父级需要给子传数据时,可以<a data="{{父级中数据}}"></a>,子接收时可以其中properties下的data即父级传过来的数据。

7、

App()必须在app.js中注册,且不能注册多个。

不要在定义于App()内的函数中调用getApp(),使用this就可以拿到app实例。

不要在onLaunch的时候调用getCurrentPage(),此时page还没有生成。

通过getApp()获取实例之后,不要私自调用生命周期函数。

 

8、在循环嵌套,如下:需要注意的是,每次for循环时,每个item应该是有各自的作用域一样,并不会导致冲突。

<view wx:for="{{item.tm_hot_ad}}"  wx:for-item="item"  wx:key="index">
  <view wx:for="{{item.tm_hot}}"  wx:for-item="item"  wx:key="index">

  </view>
</view>

 

 

 

 

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
总结:小程序常见问题(1)发布时间:2022-07-18
下一篇:
最近火到不行的微信小程序的常识发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap