1、微信小程序的优势和劣势
优势:微信助理,容易推广。
使用便捷。
体验良好,有接近原生app的体验。
成本更低,
劣势:单个包大小限制为2M,这导致无法开发大型的应用,采用分包最大是16M
需要像app一样审核上架,这点相对于H5的发布要麻烦一些。
处处受微信限制。例如不能直接分享到朋友圈,涉及到积分,或者虚拟交易的时候,小程序也是不允许的。
2. 项目的目录结构
pages:
wxml: 编写小程序界面结构的地方
wxss: 编写小程序样式的地方
json:编写界面配置的地方
js:编写界面逻辑的地方
utils: 编写工具类的地方
app.js:创建程序实例的位置
app.json: 编写全局配置地方
app.wxss: 编写全局样式的地方
project.config.json: 项目的配置文件
sitemap.json:配置哪些网站可以被检索到
3.小程序模板语法WXML
view标签是我们开发过程中最常用的标签了,这个就相当于Html中的div。
text标签也是我们开发中常用的,这个相当于Html中的span
image标签相当于我们Html中的img。
引用数据 : 通过{{}}的方式可以引用数据。
逻辑渲染:
<view wx:if="{{length > 5}}"> 1 </view>
<view wx:elif="{{length > 2}}"> 2 </view>
<view wx:else> 3 </view>
还有hidden隐藏true为隐藏,false为显示
使用 wx:for-item 指定数组当前元素的变量名,使用 wx:for-index 指定数组当前下标的变量名
<view wx:for="{{array}}" wx:for-index="idx" wx:for-item="itemName">
{{idx}}: {{itemName.name}}
</view>
事件
常见的事件类型
touchstart 手指触摸动作开始
touchmove 手指触摸后移动
touchcancel 手指触摸动作被打断,如来电提醒,弹窗
touchend 手指触摸动作结束
tap 手指触摸后马上离开
longpress 手指触摸后,超过350ms再离开,如果指定了事件回调函数并触发了这个事件,tap事件将不被触发
longtap 手指触摸后,超过350ms再离开(推荐使用longpress事件代替)
transitionend 会在 WXSS transition 或 wx.createAnimation 动画结束后触发
animationstart 会在一个 WXSS animation 动画开始时触发
animationiteration 会在一个 WXSS animation 一次迭代结束时触发
animationend 会在一个 WXSS animation 动画完成时触发