微信小程序怎样开发?微信小程序入门开发方法是什么?
我们很多人现在应该都用过微信小程序了。这几天微信朋友圈里讨论的都是微信小程序,但是你知道微信小程序怎么开发吗?很多微信用户问我开发微信小程序的入门方法是什么。什么?下面小编就带大家了解一下微信小程序的入门开发方法是什么?
10/10 逐步阅读
当你准备开发微信小程序时,首先需要一个小程序的APPId,可以从微信公众号网站获取。 (暂时只有官方邀请的人才能获得)。
还需要准备微信开发者工具,官方网站上也有。只需下载并安装它们。它支持Windows、Linux 和MAC 平台。
2/10小程序使用微信自研的MINA框架,提供视图层描述语言WXML和WXSS
以及基于JavaScript的逻辑层框架,它提供了视图层和逻辑层之间的数据传输和事件系统,让开发人员可以轻松地专注于数据和逻辑。
当您打开它时,系统会自动提示您创建演示。 demo结构文件树如下:
3/10 其中app.js、app.json、app.wxss必不可少,是小程序生成的依赖文件。
app.js 监控和控制整个程序的生命周期,也是声明全局变量的地方。下面是app.js中的一段代码:
4/10 上面代码中的一些API介绍:
App:注册一个小程序
onLunch:程序加载时执行的方法
getStorageSync:同步获取本地缓存
setStorageSync:设置缓存
wx.getUserInfo:获取用户信息
5/10app.json是整个小程序的全局配置。无法注释。
pages为注册页面列表,均为相对路径,省略后缀名,程序默认显示列表中的第一个。
6/10 app.wxss 是整个小程序的通用样式表。
在:
apx是适应屏幕宽度的尺寸单位。对应的是rem:指定屏幕宽度为20rem; 1rem=(750/20)rpx。
7/10 全局文件就这样了,接下来我们看看索引文件的内容。
内容分为三部分,index.js、index.wxml、index.wxss。下面分别介绍它们的功能。
8/10index.wxml 文件
这是一个显示页面,其工作方式与html 相同。可以看到,内容块都使用了view标签,这很容易让人想到Android中的布局,但实际上只是更多
分区
另一个版本的标签,里面有很多MINA自定义属性,我们还看到里面有{{ }}样式的取值操作,这也是很容易想到的。
角JS
MINA 中还支持MINA 中数据的双向绑定。
同时,页面的显示需要在小程序的全局json配置文件中进行配置,如前所述。
9/10index.js 文件
在:
getApp() 获取应用程序实例
页码:声明页。
数据:定义数据
bindViewTap:定义了视图中绑定的tap事件的操作方法。
wx.navigateTo:导航到响应页面。
onLoad:定义页面加载时的事件。这里使用全局app.js中定义的回调函数来更新data中的数据。由于是双向绑定,页面中的数据
userInfo 实例也会更新以显示您的头像和昵称。
10/10index.wxss 中还定义了一些样式。编写思路与css文件基本相同,但无需担心屏幕适配问题。
然后就可以看到效果了。您可以在开发者工具中扫码查看效果。
防范措施
这只是一个介绍性的例子,后续会提供详细的API文档。
微信小程序处于内测阶段,开发详情为
以上是小编为您整理的内容。你知道微信小程序入门开发方法是什么吗?希望小编的内容对您有所帮助。