基础知识
分包
easycom机制
传统vue组件，需要安装、引用、注册，三个步骤后才能使用组件。easycom将其精简为一步。 只要组件安装在项目的components目录下，并符合components/组件名称/组件名称.vue目录结构。就可以不用引用、注册，直接在页面中使用。 如下：
"easycom": {
"autoscan": true,
"custom": {
"^uni-(.*)": "@/components/uni-$1.vue", // 匹配components目录内的vue文件
"^vue-file-(.*)": "packageName/path/to/vue-file-$1.vue" // 匹配node_modules内的vue文件
}
}
<template>
<view class="container">
<uni-list>
<uni-list-item title="第一行"></uni-list-item>
<uni-list-item title="第二行"></uni-list-item>
</uni-list>
</view>
</template>
<script>
// 这里不用import引入，也不需要在components内注册uni-list组件。template里就可以直接用
export default {
data() {
return {
}
}
}
</script>
应用生命周期
- onLaunch 初始化完成时触发(全局只触发一次)
- onShow 启动 或 从后台进入前台显示
- onHide 从前台到后台触发
- onError 报错时触发
- onUniNViewMessage nvue 对页面发送数据进行监听
- onUnihandleRejection 对未处理的promise 拒绝事件监听函数
- onPageNotFound 页面不存在监听
- onThemeChange 监听系统主题变化
页面生命周期
- onInit 监听页面初始化，其参数同 onLoad 参数，为上个页面传递的数据，参数类型为 Object（用于页面传参），触发时机早于 onLoad
- onLoad 监听页面加载，其参数为上个页面传递的数据，参数类型为 Object（用于页面传参），参考示例
- onShow 监听页面显示。页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面
- onReady 监听页面初次渲染完成。注意如果渲染速度快，会在页面进入动画完成前触发
- onHide 监听页面隐藏
- onUnload 监听页面卸载
- onResize 监听窗口尺寸变化
- onPullDownRefresh 监听用户下拉动作，一般用于下拉刷新
- onReachBottom 页面滚动到底部的事件（不是scroll-view滚到底），常用于下拉下一页数据。具体见下方注意事项
- onTabItemTap 点击 tab 时触发，
- onShareAppMessage 用户点击右上角分享
- onPageScroll 监听页面滚动
- onNavigationBarButtonTap 监听原生标题栏按钮点击事件
- onBackPress 监听页面返回，返回
event = {from:backbutton、 navigateBack}，backbutton 表示来源是左上角返回按钮或 android 返回键；navigateBack表示来源是 uni.navigateBack ；详细说明及使用：onBackPress 详解 - onNavigationBarSearchInputChanged 监听原生标题栏搜索输入框输入内容变化事件
- onNavigationBarSearchInputConfirmed 监听原生标题栏搜索输入框搜索事件，用户点击软键盘上的“搜索”按钮时触发。
- onNavigationBarSearchInputClicked 监听原生标题栏搜索输入框点击事件（pages.json 中的 searchInput 配置 disabled 为 true 时才会触发）
- onShareTimeline 监听用户点击右上角转发到朋友圈
- onAddToFavorites 监听用户点击右上角收藏
404
<template>
<view>
当前页面不存在
</view>
</template>
export deafult {
data(){
return {}
},
onLoad(){
let timer = setTimeout(()=>{
clearTimeout(timer)
uni.switchTab({
url:'pages/index/index'
},200)
})
}
}