zoukankan      html  css  js  c++  java
  • 微信小程序开发初体验

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

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

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

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

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

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

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

    • index 页面右侧有个 a-z 的导航,如果是 web 端,用锚点即可解决,但是小程序没法用锚点,正确的解决方案是用 scroll-view 组件,而且需要设置 height 属性(程序中设置 scroll-view 的 height 属性为 100%),并且父节点需要设置 height 属性为 100%(程序中设置 page 标签的 height 为 100%)本来还想做导航到指定区域时候的 active,但是不好做,遂放弃
    • 小程序没有 div p 等标签,只能用它自带的 组件,可以把 view 组件当作是 web 开发时候的 div
    • 因为我抓取的页面,有直接抓取 html 代码,那么就有个问题,如何在小程序中插入 html 代码?如果是 web 开发,innerHTML 即可,但是小程序没有 dom,可以用 wxParse,其实就是把 html 转换为了小程序语言的组件(没有看过具体实现,我觉得应该就是先转为抽象语法树(Abstract syntax tree),然后替换)
    • 有个地方想用到类似 Vue 的 filter 功能,小程序中可以用 wxs 实现,同时貌似发现小程序 {{}} 中居然不能运算?只能基础赋值?(小程序其实自带了富文本组件 rich-text,但是不好用)
    • 小程序中有专门的 css 叫做 wxss,它建议用单位 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 来改写这个简单的小程序

  • 相关阅读:
    【转】c#文件操作大全(一)
    Visual Assist安装、破解方法
    web socket多线程实时监听
    SFTP上传下载
    数据库分页代码
    JAVA H5微信分享
    Eclipse中activiti插件的安装
    HTTP请求报文和HTTP响应报文
    CodeVS 1013&1029
    Codeforces 805D/804B
  • 原文地址:https://www.cnblogs.com/lessfish/p/9392967.html
Copyright © 2011-2022 走看看