温馨提示×

温馨提示×

您好,登录后才能下订单哦!

密码登录×
登录注册×
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》

小程序开发中遇到的问题怎么解决

发布时间:2022-04-08 14:19:42 来源:亿速云 阅读:149 作者:iii 栏目:编程语言

本文小编为大家详细介绍“小程序开发中遇到的问题怎么解决”,内容详细,步骤清晰,细节处理妥当,希望这篇“小程序开发中遇到的问题怎么解决”文章能帮助大家解决疑惑,下面跟着小编的思路慢慢深入,一起来学习新知识吧。

问题总结:
(1) 分隔线高度使用rpx问题
在相邻的两条信息直接都会有一个分割线,将线的高度都设置成1rpx,在第一条和第二条之前的分隔线没有显示,但是其他的都展示了,分割线的属性是一样的,而且在不同的手机上(分辨率不同)不显示的分割线也是不同的,有的分辨率好几条分割线都不显示,不知道这是模拟器的bug还是rpx的bug。解决方法:分割线的高度尺寸单位使用了px,解决了这个问题。

(2) Page注册问题
这个错误可能很容易理解,页面注册错误。页面是通过Page对象来渲染的,每个页面对应的js文件必须要创建page,最简单的方式就是在js文件下写入Page({}),在page中有管理页面渲染的生命周期,以及数据处理,事件都在这完成。这个错误引起的原因一般都是刚创建页面,js文件还有有处理或者忘了处理。
解决方法:养成创建页面的同时在js文件先创建Page的习惯.

(3) Page route 错误
重复调用路由引起的,处理方法就是删除一个路由,删除<navigator />组件或者删除wx.navigateTo。

(4) Don’t have * Handle in current page.
其实这种问题出现一般就是我们在wxml定义了一些处理事件,但是在js文件中没有实现这个时事件的处理方法,就会出现这个错误。那么我们按提示在js文件加上事件处理
解决方法:不要漏掉任何调用事件的方法实现

(5) tabBar 设置不显示
对于tabBar不显示,原因有很多,查找这个错误直接去app.json这个文件

未将页面注册到app.json中

tabBar写法错误导致的不显示,将其中的大写字母B写成小写,导致tabBar不显示

tabBar的list中没有写pagePath字段,或者pagePath中的页面没有注册

tabBar的list的pagePath指定的页面没有写在注册页面第一个。微信小程序的逻辑是”pages”中的第一个页面是首页,也就是程序启动后第一个显示的页面,如果tabBar的list的pagePath指定的页面都不是pages的第一个,当然也就不会显示tabBar了。

tabBar的数量低于两项或者高于五项,微信官方中明确规定tabBar的至少两项最多五项。超过或者少于都不会显示tabBar。

(6) wx.navigateTo 无法打开页面
一个应用同时只能打开5个页面,当已经打开了5个页面之后,wx.navigateTo不能正常打开新页面。请避免多层级的交互方式,或者使用wx.redirectTo

(7) 本地资源无法通过css获取
background-image:可以使用网络图片,或者 base64,或者使用<image/>标签

(8) 页面数据传递
微信小程序路由(页面跳转)是通过API wx.navigateTo或者wxml中<navigator/>组件实现的,不管哪种实现都会有一个重要的参数就是url,它指定了要跳转的页面,并且页面之间数据传递也是通过url来实现的,这个数据传递有点类似于我们使用的get网络请求,把参数都拼接在要跳转界面地址的后面并以“?”连接。然后将要传入的数据以键和值的形式追加在”?”后面,多个参数直接用”&”符合。可以这样写

<navigator url="/pages/dynamic/dynamic?title={{item.title}}&message={{item.message}}">
<view class="item" >
<view class="item-left">
<image src="{{item.url}}" class="image"/>
</view>
<view class="item-middle">
<view>
<text class="title">{{item.title}}</text>
</view>
<view>
<text class="message">{{item.message}}</text>
</view>
</view>
<view class="item_right">
<view><text class="time">{{item.time}}</text></view>
<view class="mark" wx:if="{{item.count>0}}"><text class="text">{{item.count}}</text></view>
</view>
</view>
<view class="line"></view>
</navigator>

而数据接收是在js文件的page里接收的,page生命周期有一个onLoad函数,它就是做一些初始化数据的工作,onLoad函数有一个参数options,我们就可以通过key将数据获取,如下

onLoad:function(options){
// 页面初始化 options为页面跳转所带来的参数
console.log(options.title) //这里是接收参数
console.log(options.message)
},

这样就实现了页面间数据传递功能。

读到这里,这篇“小程序开发中遇到的问题怎么解决”文章已经介绍完毕,想要掌握这篇文章的知识点还需要大家自己动手实践使用过才能领会,如果想了解更多相关内容的文章,欢迎关注亿速云行业资讯频道。

向AI问一下细节

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

AI