小程序开发平台(小程序开发)

导读 你们好,最近小活发现有诸多的小伙伴们对于小程序开发平台,小程序开发这个问题都颇为感兴趣的,今天小活为大家梳理了下,一起往下看看吧。

你们好,最近小活发现有诸多的小伙伴们对于小程序开发平台,小程序开发这个问题都颇为感兴趣的,今天小活为大家梳理了下,一起往下看看吧。

1、 当你准备开发一个微信小程序的时候,首先需要一个小程序的APPId,可以从微信微信官方账号官网获取。暂时只有正式邀请的人才能拿到。

2、 还需要准备微信开发者工具,官网也有。下载安装即可,支持windows、linux、MAC平台。

3、 小程序用的微信,自己开发MINA框架,提供视图层描述语言,WXML和WXSS,基于JavaScript的逻辑层框架,提供视图层和逻辑层之间的数据传输和事件系统。

4、 它允许开发人员方便地关注数据和逻辑。

5、 当你打开它时,会自动提示你创建一个演示。演示结构文件树如下:

6、 其中app.js、app.json、app.wxss是必不可少的,是小程序生成的依赖文件。

7、 App.js对这整个程序的生命周期进行监控,也是声明全局变量的地方。以下是app.js中的一段代码:

8、 上面代码中的一些API介绍:

9、 App:注册一个小程序。

10、 程序加载时执行的方法。

11、 GetStorageSync:同步获取本地缓存。

12、 setStorageSync:设置缓存

13、 Wx.getUserInfo:获取用户信息。

14、 App.json是整个小程序的全局配置。无可奉告。

15、 Pages是已注册页面的列表,所有页面都是相对路径,去掉了后缀,程序默认显示第一个列表。

16、 App.wxss是整个小程序的通用样式表。

17、 其中包括:

18、 Apx是一个尺寸单位,可以适应屏幕宽度。相应的,rem:屏幕宽度指定为20rem;1rem=(750/20)rpx .

19、 这就是全局文件的全部内容,然后我们将查看索引文件的内容。

20、 有三个部分,index.js,index.wxml,index.wxss,下面介绍它们的作用。

21、 index.wxml文件

22、 这是一个显示页面,和html的效果一样。可以看出内容块都用上了。

23、 View标签,很容易让人联想到Android中的布局,其实只是div标签的另一个版本,里面有很多MINA。

24、 自定义属性,其中我们还看到了{{}}样式的值操作,这也很容易让人联想到angularJS中数据的双向绑定,在MINA中。

25、 也支持。

26、 同时,页面的显示需要在applet的全局json配置文件中进行配置,如前所述。

27、 Index. js file

28、 其中包括:

29、 GetApp()获取应用程序实例

30、 Page : 声明页面。

31、 data: 定义数据

32、 bindViewTap :为在view中绑定的是tap事件定义操作方法。

33、 wx.navigateTo :导航到响应页面。

34、 onLoad : 定义页面加载时的事件。在这里使用了在全局app.js 中定义的回调函数,将data中的数据更新,由于双向的绑定,页面中的userInfo 实例也会更新,显示出您的头像和昵称。

35、 index.wxss 中同样定义了一些样式,写法思路与css文件基本一致,只是不需要再去关心屏幕适配问题。

36、 随后就是效果展示了,在开发者工具中扫码即可查看效果。

以上就是小程序开发这篇文章的一些介绍,希望对大家有所帮助。

标签:

免责声明:本文由用户上传,如有侵权请联系删除!