小程序开发遇到的问题(小程序开发常见问题)
今天给各位分享小程序开发遇到的问题的知识,其中也会对小程序开发常见问题进行解释,如果能碰巧解决你现在面临的问题,别忘了关注本站,现在开始吧!
本文目录一览:
小程序开发的难点是什么?
小程序开发的难点有:如何通过技术手段提升开发效率以应对不断增长的业务需求?微信小程序的工程化探索有哪些最新进展?如何实现小程序自动化构建、自动化测试?
如何将小程序开发与团队现有的技术栈有机结合?如何适配 H5、React Native微信小程序等多端需求?如何扩展小程序的能力、满足产品设计上的复杂需求?如何突破小程序包大小的限制?
如何解决页面层级限制问题?在遇到长列表场景时,小程序渲染性能会出现瓶颈,如何进行性能优化?由于微信小程序中缺少对 DOM 的控制,该如何满足复杂交互需求?【点击查看小程序开发底价】
想要了解更多有关小程序开发的相关信息,推荐咨询猪八戒网。猪八戒网成立于2006年,是中国领先的企业服务平台,服务交易独角兽企业。猪八戒网现有注册用户2800万、在全国布局线下数字化创业园区超过100个。十余年来,累计有10万余个人通过平台孵化成长为公司,超过100万人通过平台实现灵活就业,千万企业通过平台解决专业服务需求;专业性值得选择。
小程序开发经验总结
最近一直在做小程序,工作中也遇到了一些问题,踩了一些坑,所以想着写篇文章记录下来,并借此将小程序开发的相关知识进行梳理,方便以后参考,也为刚刚接触小程序的人提供一些思路方法,互相学习,共同进步。
1、微信小程序的目录结构及配置说明
app.json是小程序的全局配置文件,所有配置项key必须使用 双引号括起来 ,value值为字符串类型的也必须使用双引号, 不支持单引号 。
1.1 pages
pages选项是必须配置的。该配置项注册了小程序所有页面的地址,其中每一项都是页面的 路径+文件名 。每一个页面都是由.json、.js、.wxml、.wxss四个文件组成,并且 四个文件的名字必须要一致 。
1.2 tabBar
tabBar 配置项指定 tab 栏的表现,以及 tab 切换时显示的对应页面。其中 list 接受一个数组,只能配置最少 2 个、最多 5 个 tab
1.3 usingComponents
使用自定义组件或者插件提供的组件前,必须先在这里声明
2、开发微信小程序遇到的问题及解决办法
2.1 双向绑定
微信小程序不支持通过v-model的方式实现自动双向绑定,需要给表单元素通过绑定事件,并使用this.setData来赋值实现。
2.2 computed和watch
微信小程序默认是不支持computed和watch的,如需要使用这两项功能,需要安装miniprogram-computed ,安装方法见 官方文档
2.3 对象赋值
如果给对象的属性赋值,可以使用this.setData({'obj.key':value})来赋值,但是如果给某个属性名是变量的属性赋值,通过这种方法是会报错的,经过多次尝试,发现使用如下的方式赋值成功。
let newObj = `obj.${key}`
this.setData({
[newObj]: value
})
2.4 scroll-view
当页面存在弹框容器,并且弹框里的内容是需要滚动条滚动展示时,如果弹框下面那层的容器使用view元素的话,会导致滚动弹框内容时,同时会触发弹框下面那层的页面容器也会一起滚动,解决此问题可以将弹框下面的容器使用scroll-view元素替代view元素
3、小程序测试和发布
由于服务器域名request合法域名每个月 只能修改5次 ,因此在本地开发小程序时,需要在微信调试工具中设置不校验合法域名。等小程序上线前再一次性将所有域名添加到小程序管理后台。
以上便是此次小程序开发中积累的一些经验,希望能给刚刚接触小程序的人提供一些思路方法,在以后的开发中,如果遇到新的问题,继续更新文档......
微信小程序开发中遇到的坑及解决办法
taro单独为某个项目切换taro版本环境
单独为某一个项目升级#这样做的好处是全局的 Taro 版本还是 1.x 的,多个项目间的依赖不冲突,其余项目依然可以用旧版本开发。 如果你的项目里没有安装 Taro CLI,你需要先装一个:
# 如果你使用 NPM
$ npm install --save-dev @tarojs/cli@2.x
# 如果你使用 Yarn
$ yarn add -D @tarojs/cli@2.x
echarts在小程序中滑动卡顿
由于微信小程序中,echarts的层级最高,无论设置多大层级也无法遮住echarts。而且小程序中好像只能用echarts吧。所以为了解决这个bug,我只能委屈求全了。打开ec-canvas.wxml文件,将touchStart、touchMove和touchEnd去掉了,直接删除就好啦。这三个事件应该是做缩放的吧,我们也没有这个缩放的需求。所以就去掉了。虽然暂时满足的需求,还是没有真正的解决问题。
原:
bindinit="init"
bindtouchstart="{{ ec.disableTouch ? '' : 'touchStart' }}"
bindtouchmove="{{ ec.disableTouch ? '' : 'touchMove' }}"
bindtouchend="{{ ec.disableTouch ? '' : 'touchEnd' }}"
现:
bindinit="init"
echarts在小程序中无法跟随页面滑动
在卡顿问题中能与echarts交互少的,可以直接使用图片代替cannvas,即在echarts渲染完毕后将它替换为一张图片。
如果我更新了数据,那么就重新放出echarts,等它渲染完毕后,再次替换为一张图片。
chart.on('finished', () = {
getCurrentInstance().page.selectComponent(id).canvasToTempFilePath({
success: res = {
console.log('res.tempFilePath====',res.tempFilePath)
this.setState({
echartImgSrc: res.tempFilePath
})
},
fail: res =console.log('转换图片失败', res)
});
})
render:
this.state.echartImgSrc =='' ?
ref={this.refChart}
id={this.state.id}
canvas-id="mychart-area"
force-use-old-canvas="true"
ec={this.state.ec}
/
:
CoverImage src={this.state.echartImgSrc}/CoverImage
小程序开发遇到的问题的介绍就聊到这里吧,感谢你花时间阅读本站内容,更多关于小程序开发常见问题、小程序开发遇到的问题的信息别忘了在本站进行查找喔。