美文网首页
uni-app 开发微信小程序注意细节记录

uni-app 开发微信小程序注意细节记录

作者: 虾米不是鱼 | 来源:发表于2020-10-16 11:03 被阅读0次

    1.webview 传参注意参数要进行encodeURIComponent,因为我们自己的URL上面有参数 “?”,小程序传参自带了“?”会冲突。在接收的地方记得解码decodeURIComponent。

    const url = "http://www.xxx.com?id=1111"
    uni.navigateTo({
         url: "/pages/webviews/webviews?url=" + encodeURIComponent(url)// url 和 id 参数 问号解析冲突
    });
    

    2.标签 要用css控制解决ide警报
    例如

    .box image {
      display: block;
      width: 350rpx;
      height: 520rpx;
    }
    
    eg1.png

    3.控制vue data大小过滤数据,优化性能,小程序单次设置的数据大小不得超过1024kb。


    image.png

    不仅仅在小程序中我们要注意,在平时vue开发过程中今天非页面渲染的值,不要放在data中,data只放跟视图相关的数据。
    可以这样

    <script>
    let SCROLL_TOP = 0; // 滚动高度
    let NAV_HEIGHT = 0;
    let TOTAL_PAGE = 0; // 总页面
    const PAGE_NUM = 10; // 分页每次加载条数
    let List = [];
    export default {
      data() {
        return {
          bbb: '',
          aaa:''
      }
    }
    

    4.uni-app 使用缩放 mode widthFix 宽度不变,高度自动变化,保持原图宽高比不变。默认图片高度为240,并且改变有延迟。在我的项目中在做瀑布流的时候图片过大没有及时的改变图片高度,可能会出现高度计算问题。解决方案,最好不使用widthFix,结合项目给一个图片固定高度。

    5.navigateTo是跳转非tab路由,如果要跳转tab请使用switchTab

    6.微信小程序中的所有访问链接请使用 https,链接不是想访问就能访问的,需要在微信小程序后台配置合法域名。

    相关文章

      网友评论

          本文标题:uni-app 开发微信小程序注意细节记录

          本文链接:https://www.haomeiwen.com/subject/aheupktx.html