通用小程序开发框架


不知道各位有没有因为安装很多软件程序,每天很多提醒内存不足,导致烦恼,如果有一个软件能够满足提供能力给外部,同时又能轻松实现开发,那么真的是太棒了。终于救世主出现了,小程序腾空出世,快捷使用,轻松传播,对开发者来说,也很简单。但是当小程序爆发之后,江湖乱了,各家小程序争先恐后唯恐江湖不乱。何时才能出武林盟主,一统江湖,从此还江湖一个平静。

各家都有小程序,那么对开发者来说如何才5能避免多做无谓的搬砖工作,程序员也不是万能的,会七十二变,每个平台的小程序都要会开发,但是话又说回来了,今天我们会这个,那么明天会不会有其他的又要出世,于是乎,噩梦又来了。如今有这样一个框架能实现我们的需求,write once,run everywhere!是不是觉得激动,那么今天我们就来接触一下,这个神秘的救世主。OKAM,专为小程序开发的框架,目前实现百度、微信、支付宝小程序;所以我们的框架也是基于此框架,进行优化,满足我们的需求。接下来我们一步步了解这个框架:

具体可以参考readme文件;我们的项目默认做了处理,可以直接使用this.data属性,在scripts/base.config.js文件中,我们配置了常用属性,完全可以满足开发需要,而且可以像在vue中开发一样;

项目进行了适配,我们可以直接使用px开发,项目自动转换为rpx;当然对于不需要转换的我们使用注释来禁止:/*px2rpx: no*/,项目配置了redux,我们使用也非常简单,项目默认做了状态拆分,公共使用commonReducer,其他的我们根据自己项目需求来配置,组件中使用的时候引入$store,当作计算属性来使用,改变状态我们使用唯一的提交函数Util.commit。

a、模板语法,同vue一样,使用{{}},当然有data。也有props属性,computed、watch,有methods,组件同vue一样;语法与vue稍有不同,去掉了特殊的小程序前缀;需要注意的是在data、props、computed、methods中定义的属性或方法不能与 框架属性名冲突

d、事件绑定使用@,事件惯例使用小写,框架会转换成响应的小程序语法,我们完全随意可以使用。

e、标签配置,在scripts/base.config.js 中component配置了转换规则,我们可以像开发网页一样使用HTML标签

g、广播事件 broadcastEvents: {},this.$broadcast('myBroadcastEvent', {msg: 'xxx'})

使用API,我们推荐使用this.$api.APIName;请求接口使用封装的this.$http.get、post;当然这还是要求我们对小程序文档要熟悉掌握,才能使用顺心;

同学们上课都挺累的吧,我给大家讲个《西游记》的故事放松一下。话说师徒一行西去,被白骨精盯上了,孙悟空去给师父找吃的,用金箍棒在地上画了一个圈,半径2米,问面积是多少?”