博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
微信小程序开发初体验
阅读量:5798 次
发布时间:2019-06-18

本文共 1373 字,大约阅读时间需要 4 分钟。

最近因为工作需要入门了一下小程序,边入门也边在思考小程序的应用场景,“用完即走” 四个字一直浮现在脑海。正好最近在学驾照,因为以前一直对车不感冒,所以连奔驰都不认识,正好做个车标速查的小程序,非常符合 “用完即走” 的理念

最终源码点击 (附小程序码),车标信息数据来自

因为小程序是国产的,所以 是比较友好的,基本上花个半天看下就可以入门了。在一个初学者的角度,谈谈对小程序的感受

首先,小程序这个东西出现的用意是非常好的,依托于微信,自带社交、支付等,非常适合传播,比如斗地主这样的小程序(小游戏),分享到群,然后开玩,用完即走,非常之爽

然后,小程序的运行本身不依托于浏览器,没有 dom 的概念,在性能上,也比 h5 流畅了不少

可以说,小程序这个东西,还是非常有前途的

然后来说说开发这个 车标速查 小程序时候踩的一些坑吧:

  • index 页面右侧有个 a-z 的导航,如果是 web 端,用锚点即可解决,但是小程序没法用锚点,正确的解决方案是用 组件,而且需要设置 height 属性(程序中设置 scroll-view 的 height 属性为 100%),并且父节点需要设置 height 属性为 100%(程序中设置 page 标签的 height 为 100%)本来还想做导航到指定区域时候的 active,但是不好做,遂放弃
  • 小程序没有 div p 等标签,只能用它自带的 ,可以把 view 组件当作是 web 开发时候的 div
  • 因为我抓取的页面,有直接抓取 html 代码,那么就有个问题,如何在小程序中插入 html 代码?如果是 web 开发,innerHTML 即可,但是小程序没有 dom,可以用 ,其实就是把 html 转换为了小程序语言的组件(没有看过具体实现,我觉得应该就是先转为抽象语法树(Abstract syntax tree),然后替换)
  • 有个地方想用到类似 Vue 的 filter 功能,小程序中可以用 实现,同时貌似发现小程序 {
    {}}
    中居然不能运算?只能基础赋值?(小程序其实自带了富文本组件 rich-text,但是不好用)
  • 小程序中有专门的 css 叫做 ,它建议用单位 rpx,规定屏幕宽为 750rpx。建议用 iPhone6 做设计稿,375px,然后设计稿一般是双倍,也就是 750px,那么 1px 就对应 1rpx 了,直接按照设计稿来就好了
  • app.js 有个勾子叫做 onLaunch,在小程序启动的时候会触发,这让小程序看起来更像是 app,因为类似 Vue 这样的 web app 并没有这样的勾子
  • 如果点击右上角要能够分享,必须要写 onShareAppMessage,而这个函数会在转发的时候触发。这点设计不是很能理解,我的观点是这个配置应该放在 xx.json 里面,而不是放在类似这样的勾子函数里
  • project.config.json 不需要自己去写,而是改变微信开发者工具里的一些配置后,会自动更新,类似 Alfred workflow 开发时候的 info.plist 文件
  • 最后说到发布,貌似一个账号只能发布一个小程序/公众号?之前账号注册了一个公众号,现在不能添加小程序了,只能再注册一个账号了

接下去计划用 mpvue 来改写这个简单的小程序

转载地址:http://rqifx.baihongyu.com/

你可能感兴趣的文章
django 目录结构修改
查看>>
win8 关闭防火墙
查看>>
OAF_文件系列2_实现OAF导出CSV格式文件ExportButton(案例)
查看>>
Android实例-录音与回放(播放MP3)(XE8+小米2)
查看>>
构建自己的PHP框架--抽象Controller的基类
查看>>
CSS——(2)与标准流盒模型
查看>>
MYSQL 基本SQL语句
查看>>
Codeforces 451E Devu and Flowers(容斥原理)
查看>>
P2P行业专业术语(最全)
查看>>
C#中的Marshal
查看>>
网站发的文章有收录 但是没有排名怎么处理
查看>>
linux命令:ls
查看>>
Using RequireJS in AngularJS Applications
查看>>
hdu 2444(二分图最大匹配)
查看>>
shell编程笔记六:实现ll命令
查看>>
【SAP HANA】关于SAP HANA中带层次结构的计算视图Cacultation View创建、激活状况下在系统中生成对象的研究...
查看>>
[nodejs] nodejs开发个人博客(五)分配数据
查看>>
《Linux内核修炼之道》 之 高效学习Linux内核
查看>>
Java数据持久层框架 MyBatis之API学习九(SQL语句构建器详解)
查看>>
30分钟Git命令“从入门到放弃”
查看>>