微信小程序刚出来,让前端这个圈子又热了起来,不少从业人员,也开始尝鲜; 从官网上的wiki到微信开发工具的使用,有一些使用心得,再这里总结一下;
如果有那里说错了,或有疑问,欢迎大家提出来,与大家一起学习成长。
官网上的wiki
微信的文档还是很详细的,只要是从业人员,看文档便可看明白,实际操作也是简单的很,上手快,微信这一点做的还是很不错的,毕竟是大公司嘛
它总体用的框架是MVVM,现在前端大部分都已经使用这类框架,如angular.js、vue.js、avalon.js 等,
开发标准也是web前端大同小异,如下
- WXML -> html
- WXSS -> css
- js -> js
- json -> json方式的配置文件
它的WXML就等同于html,只是标签没有了,取而待之的是组件形式,大部分的功能组件已经都有的,但是有些组件的api还是有些少的,目前也没有第三方组件,(以后应该会用的,毕竟这也是刚出来的)
语法就重要的三块内容就是框架、组件、api
框架 -> 相关页面的说明
json文件为配置说明,在根目录有一个基本的app.json,里面配置整个项目的页面,如pages,window,tabBar,networkTimeout等,也可以在某个页面相关目录下,建单页面的配置
js文件为逻辑处理文件,与正常的js一样,但是不能使用document、window等内容,模块化开发方式,各个js文件都是相互独立的,可以通过require、include方式调用不同的模块
WXML 文件为视图层,数据绑定的方式也是Mustache语法(双大括号),属性绑定的前缀为wx:,和其它MVVM框架的属性绑定方式大同小异
** WXSS 文件为样式文件**,使用css语法,尺寸单位为rpx,规定屏幕宽为750rpx,iPhone6上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375px = 750物理像素,
组件
WXML只能用组件的方式,每个组件都有自己的属性,属性是添加在WXML上的,相当于src、href 这些内容
组件分为:
-
视图窗口 ->
- 视图窗口(等同于DIV)
- 可滚动视图区域(等同于一个滚动插件)
-
滑块视图容器。(等同于一个banner插件)
-
基础内容
-
图标(等同于图标库)
文本(添加文字信息)
进度条(一个进度条的内容)
-
-
表单组件
-
按钮(等同于 type=button)
多项选择器(等同于type=checkbox)
表单(赞同于form)
输入框 (等同于type=text)
标签(等同于label)
-
滚动选择器(等同于select)
单项选择器(等同于type=radio)
-
滑动选择器(等同于type=range)
开关选择器(等同于Bootstrap Switch)
-
-
操作反馈
-
从屏幕底部出现的菜单表
-
模态弹窗
-
消息提示框
-
加载提示
-
导航
1、页面链接(等同于a标签,但是只在连接内部页面,不能连接外部页面)-
媒体组件
-
音频(等同于audio,可以连接外部音频文件)
图片(等同于img,可以连接外部视频文件)
-
视频(等同于video,可以连接外部视频文件)
-
-
地图
- 地图(map)
-
画布
- 画布(等同于canvas)
API
- native交互的接口
- 设备
- 网络请求的接口
- 网络
- 位置
- 微信通信的接口
- 界面
- 开放接口
现在出来的是内测版,功能上来说已经添加了大部分常用功能,但是还有一些不足,希望以后微信可以更好的完善。
有些人说,微信可能会取代app,我觉的,这是不可能的。
第一、当时的pc游戏现在已经可以在网页中玩了,但是现在的pc游戏变的更加好,再过十年现在的pc游戏可能会出现在网页中,但是那到时,会出现更好的pc游戏,这和app是一样的,微信限制了很多东西,现在要按它的ui来设计界面,等到它的能力到达现在的app这样,到那时,app可能会做出更好的东西,未来我们是很难想像的。
第二,微信毕竟是腾讯的,别的公司不可能把自己的命运都放在腾讯手里,他们可能会开发微信应用,但不会把微信应用做为一个主要的流量入口,
他们可能会将微信做一个导入自己产品的一个入口。
以上观点为个人观点,不喜误喷!