uniapp之微信小程序(一)
一. template
1. 使用Vue.prototype,如Vue.prototype.$store
如果$store.state.name是个string类型等非函数类型,不能在template中,比如{{$store.state.name}}直接使用或者在v-if中等使用。
如果$store.state.name是个函数类型,可以
解决: 推荐把$store.state.name放在computed中使用
二. script
1. props
传递函数类型的prop,
但动态改变这个传递的参数时,子组件无法响应
解决: 使用$store
2. 生命周期
vue组件生命周期和页面周期一起的顺序
(1)加载时:
beforeCreate
created 组件创建
beforeMount
onLoad 可以获取从另一个页面的数据
show 页面刚出现
mounted 获取数据
ready 页面初次渲染
(2)页面改变时:
beforeUpdate,
updated
(3)页面卸载的时候
onUnload,
beforeDestroyed,
destroyed
无onInit
三. style
1. rpx
即响应式px,一种根据屏幕宽度自适应的动态单位。
规定屏幕宽为750rpx。如在 iPhone6 上,屏幕宽度为375px,共有750个物理像素,则750rpx = 375px = 750物理像素,1rpx = 0.5px = 1物理像素。
开发微信小程序时设计师可以用 iPhone6 作为视觉稿的标准,所以使用750px的设计稿,可以达到1rpx = 1px的效果
2. vh
100vh在微信小程序中不包括导航和tarbar
h5中:CSS 內使用 vh 单位的时候注意 100vh 包含导航栏,使用时需要减去导航栏和 tabBar 高度,部分浏览器还包含浏览器操作栏高度,使用时请注意