uniapp总结笔记
当前跨平台开发存在的问题
（1）多端泛滥成灾
（2）用户体验不好
（3）生态不丰富
（4）bug一堆堆
uni-app特点：
1.跨平台更多：一套代码，适应各种版本
2.运行体验更好：组件、api与微信小程序一致，兼容weex原生渲染。
3.通用技术栈，学习成本更低 vue的语法、微信小程序的标签和api，内嵌mpvue开源框架
4.开放生态，组件更丰富：支持npm安装第三方包，，支持微信小程序自定义组件及SDK，兼容mpvue组件及项目，App端支持和原生混合编码，Dcloud将发布插件市场
开发一次，多端覆盖：各种小程序、android、ios、H5。
1、数据的绑定
2、注册事件和传递参数
3、生命周期函数的学习
应用的周期函数
onLaunch：初始化完成时触发（全局只触发一次）
onShow ：启动时，或从后台进入前台是显示
onHide：从前台进入后台
onError：报错时触发
页面的周期函数
onLoad：监听页面加载，参数为上个页面传递的参数，参数类型为对象（触发一次）
onShow：监听页面显示，页面每次出现在屏幕上都触发，包括从下级页面点返回，返回到当前页面
onReady：监听页面初次渲染完成（触发一次）
onHide：监听页面隐藏
onUnload：监听页面卸载
onResize：监听窗口尺寸变化
onPullDownRefresh：监听用户下拉动作，一般用户下拉刷新，与onLoad生命周期函数同级
4、下拉刷新onPullDownRefresh
开启下拉刷新
onPullDownRefresh () {
//刷新初始化数据
this.size = 10
this.current = 1
//调用获取数据的函数
this.getData()
//关闭刷新动画
setTimeout(function () {
uni.stopPullDownRefresh()
}, 1000)
},
监听下拉刷新
关闭下拉刷新
代码简单实现
5、上拉加载 onReachBottom
const SIZE = 10
data(){
return {
size: 10,
current: 1
}
}
//上拉加载函数
onReachBottom(){
let that = this
//每次上拉加载的数据比上一次多十个
that.size += SIZE
setTimeout(()=>{
that.getData()
},1000)
}
