微信使用的开发语言和文件是“特殊的”。
小程序使用的程序文件的类型大致分为以下类型:
①WXML(WeiXin标记语言,微信标记语言)
②WXSS(微信样式表,微信样式表)
③JS(Java,小程序的主体)
就语言而言,小程序似乎重新定义了一组标准。但实际上,它们与“前端三件式” HTML,CSS和Java并没有太大区别。
接下来,我们比较一下小程序开发语言和“前端三件式”之间的异同:
HTML和WXML:两者之间有很大差异。如果您以前从未接触过Android开发,则可能会感到有些头痛。实际上,WXML更像是Android开发中的接口XML描述文件,它适合于程序接口的构造。而HTML倾向于显示文章(这与HTML的历史有关)和互联网页面的结构。
WXSS和CSS:两者之间几乎没有语言差异,可以直接使用。
JS文件:小程序的JS文件与前端开发中使用的JS几乎相同,但是小程序的JS添加了微信的一些API接口,并删除了一些不必要的功能(例如DOM)。
就语言而言,小程序完全符合学习成本最低的前端开发,但这并不意味着所有前端开发人员都可以无缝迁移。
如果从前端开发切换到小程序,则需要注意以下两点:
HTML和WXML之间的构造思想有很大差异。如果您以前只接触过前端开发,则需要一段时间才能适应WXML的编写方法。
尽管小程序使用前端语言,但这并不意味着您可以继续使用前端开发思想进行开发。 小程序前端开发的要求已从“构建接口”升级为“开发完整的应用程序”。前端开发需要改变意识。
接口构造
1.基本逻辑
WXML和WXSS是小程序接口元素声明和样式描述文件。
WXML的最大特点是接口元素以视图的方式连接,信息更新通过程序逻辑(AppService)实时传输到视图层。
view与HTML中的p元素相似。在构建过程中,视图可以嵌套在多个级别中,并且可以在视图中放置任何可视元素。
应注意,一旦元素超出屏幕,用户将无法看到它,这与HTML完全不同。
例如,我们将手机屏幕视为一个舞台,舞台外的演员无法被观众看到。
小程序有一个专门用于滚动的视图。
如果希望该界面成为可自由滚动的界面(例如列表等),则可以使用滚动视图视图,在WXSS中将其大小调整为整个屏幕,然后设置Scroll-y(滚动向上或向下)或滚动-x(向左和向右滚动)。
小程序无法直接使用DOM控制WXML元素。如果需要更新数据,则必须使用WXML提供的数据绑定和元素呈现方法。
要注意的另一件事是:小程序的网格布局系统使用Flex布局,这是W3C在2009年提出的排版标准。
2.绑定数据
对于单个字段,开发人员可以使用数据绑定来更新信息。
除了绑定的数据可以在加载时更新外,还可以在JS主程序中以函数的形式进行更新。更新也可以反映在界面上绑定的数据中。
3.条件渲染和列表(循环)渲染
有条件的渲染适用于条件异常的页面(例如无法加载列表或详细信息,提示等)。
其呈现具有触发条件,即在满足条件时呈现页面,否则将忽略或呈现另一段代码。
两个花括号中包含的判断条件中的变量在主程序的JS代码中的数据中声明。
如果需要在接口中构建列表,则可以使用WXML中的循环渲染来收集相同的元素渲染代码。可以将循环的数据以数组的形式写入数据,以进行WXML访问。
渲染后,渲染判断条件的变化会影响界面的变化。
4.模板和参考
WXML支持使用模板和引用来减小代码大小。
模板是在WXML代码中重用相同代码的一种方式。
您可以将多个模板写入同一个文件,然后使用导入功能在其他文件中引用它们。
如果需要引用整个页面,则需要使用include。
5.样式
通过WXSS样式表,开发人员可以在WXML中定义元素样式。
WXSS与CSS代码一样,可以直接使用选择器来选择元素。您还可以直接在WXML中定义元素的ID和类,以简化WXSS文件中的样式定义。
6.用户操作和事件响应
由于微信不使用HTML,因此无法通过添加超链接(元素)来监视用户点击事件。
对于需要监听单击事件的元素,应在WXML中使用bindtap属性或catchtap属性进行绑定。
除了单击之外,微信还提供对按下,开始触摸和放开等事件的响应。
在WXML中绑定事件后,可以在主程序JS中使用它。
其他API中还有其他相应的事件。这些事件可以在微信小程序的官方文档中找到。
当需要在小程序的页面之间跳转时,应使用wx.navigateTo()方法。
应注意,关于页面级别跳转,微信将级别跳转限制为五个级别。在开发过程中需要注意是否超过了相应的限制。
网络访问
小程序支持三种请求方法。
一个是直接HTTP连接请求,请求后直接返回结果,连接结束。另一个是Socket持久连接。当一方主动关闭连接时,连接结束。
除了以上两种用于发送和接收纯文本的连接方法外,微信还提供了文件发送和接收接口。 小程序中录制的声音和所选照片需要以这种方式上传。
通过小程序访问网络要求服务器端必须支持HTtps安全连接,并且端口号必须为443。
同时,小程序仅在注册小程序时才能访问开发人员设置的服务器地址。
多媒体和存储
如果需要播放多媒体(包括音频和视频)或将数据存储在小程序中,则不能使用HTML 5提供的标准,并且必须使用由小程序提供的小程序多媒体播放控制界面和存储界面微信。
声音界面有两种:音频播放和音乐播放。
音频播放提供三个界面:播放,暂停和停止播放。它没有提供跳到某个播放时间点的功能,也无法获得当前的播放进度。
音乐播放界面除了上述基本播放控件外,还提供音乐状态检查和监视等功能。
小程序提供了用于照片和视频数据交换的接口。通过此界面,小程序可以访问用户选择或拍摄的照片和视频。
通过音频录制和视频照片接口获得的多媒体信息是临时的,文件需要通过小程序文件存储接口永久存储。
对于文本数据,小程序还提供了用于存储此类数据的接口。从Android或其他应用程序平台等平台切换的开发人员需要注意,小程序不提供数据库样式的本地数据存储格式,而是将其保存为“字段值”的一对一格式。
与硬件有关
小程序依赖微信并提供许多与硬件相关的API。
小程序可以通过API获取以下数据:
与系统相关的信息(包括网络状态,设备型号,窗口大小等)
重力感应数据
指南针数据
通过上述API,编写“ Shake”之类的交互式页面应该很容易。
但是请注意:这些数据只能主动获取,而不能通过回调这些数字更改实时获取。
推送服务
小程序提供推送服务,并且可以随时向用户发送必要的通知。但是请注意,推送服务只能用于通知和提醒,而不能用于批量发送。
在小程序中,推送服务称为“模板消息”(之前已经开发了服务帐户的开发人员应该熟悉它)。开发人员需要在微信小程序后台注册新的模板推送消息(例如购买成功通知等),并对其进行审阅,然后才能在小程序中使用模板消息推送服务。建议参考相应的文档以了解特定的审计标准。
模板消息获得批准后,开发人员需要首先从微信服务器获取访问令牌,然后在模板中提交值,模板编号和动态变量(例如订单号,价格等)。 )到微信,然后按微信向用户推送通知。
用户信息和微信付款
小程序可以在得到用户同意的情况下获取用户信息。
首先,小程序需要通过微信界面登录,以允许用户授权登录。之后,小程序可以显示和使用用户信息。
使用微信登录时,您需要注意以下事实:在未篡改数据之前,需要对消息进行签名以确认其完整性。
小程序也可以使用微信进行付款。应该注意的是,在发送付款请求时,需要在发送的消息中添加签名以确认消息的完整性。