小程序开发流程、理论和踩坑点(遇到的)

版权声明:本文为博主原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。
本文链接: https://blog.csdn.net/weixin_44425934/article/details/102707909

小程序开发流程、理论和踩坑点(遇到的)

导语:让你上瘾的小程序开发~
作者:变优秀的小白

注:如中途遇到不懂的地方,直接评论留言看到会马上答疑!

最近,由于测试工作比较繁忙导致自己学习的时间比较少,也就没什么时间总结和回顾已学知识以及最近的学习状态是否保持前进。话不多说,步入正题~

尝试开发个人小程序OneBy

1.准备工作:

①下载好微信开发者工具(然后你会需要一个appid
②去微信公众平台官网上注册一个小程序开发账号(appid就会生成)

2.认识小程序基础知识

pages:放置app界面,一个文件夹对应一个界面(即一个页面新建一个目录)
一个页面分为三部分:

①js:代码文件
②wxml:界面组织结构
③wxss:文件进行设置界面样式

整个app的配置信息全部是

  • 由app开头
  • app.js:整个app监听代码文件
  • app.json:配置文件
  • app.wxss:app样式风格

一些杂乱的标签
slot:自定义组件
View:安卓→活动;ios→控制试图;微信小程序→页面
小程序只开发一个版本,因为核心是H5,可实现跨平台
页面构成四部分:①代码逻辑文件②页面配置文件③页面组织文件④页面样式文件
Wxml:页面组织文件(树形结构)①表示页面的属性层次结构②设计view的样式③数据绑定④绑定事件
Wxss:page文件样式 设置文件样式
Js:代码逻辑文件①数据②事件处理方法③生命周期方法

此外扩展部分知识
一、CDN(Content Delivery Network)内容分发网络主要作用:数据的静态分离,加速静态文件访问
二、云数据库:创建了一个todos集合:①添加记录②记录列表③索引管理④权限管理

3.构建项目,实现下方菜单栏

直接给个链接参考实现即可:https://developers.weixin.qq.com/s/jiSARvmF7i55就不做详细介绍了

4.最后,讲述一下我遇到的坑

  • Problem1: 编写app.json代码中,编译console报错Expecting ‘STRING’,got INVALID.
    Summary: 去掉注释 Cause:app.json不能有注释
  • Problem2: 将custom的值设置为true 出现thirdScriptError
    Summary: 网上解决方法为新增同级项目custom-tab-bar
  • Problem3: 将图片导入小程序项目中
    Summary:微信开发者工具-详情(右上角)-基本信息-本地目录 找到自建的image把图片移动进去即可
  • Problem4: 在.json中标签写内容不显示
    Summary:在该页面的.js中加入了Component声明,但在app.json之前加了component无效
结束语: 大家如果有什么疑问或者建议的地方,可直接留言评论!本人会一一回复!!

如果小白的博客有建议或批评的,下方留言即可!如果觉得小白还不错的,留下你的点赞和关注哦!!

猜你喜欢

转载自blog.csdn.net/weixin_44425934/article/details/102707909