生命周期
- onLoad 页面挂载前触发里面包含路由参数
- onShow 页面展示的时候触发
- onHide 页面隐藏的时候触发
- onReady DOM加载完触发
- onUnload 页面卸载的时候触发
- onPageScroll 页面滚动的时候触发返回一个对象
- onPullDownRefresh 页面下拉刷新触发
- onReachBottom 页面上拉触底触发
import { onLoad, onReady, onShow, onHide } from "@dcloudio/uni-app"使用uni-app生命周期需要引入,
1、uniapp中组件生命周期函数和页面生命周期函数的执行顺序
不包含组件的页面
onLoad > onShow > onReady
包含组件的页面
onLoad > onShow > onBeforeMount > onReady > onMounted
globalStyle配置
- navigationBarBackgroundColor 导航栏背景颜色
-
navigationBarTextStyle 导航栏标题颜色,仅支持 black/white
-
navigationBarTitleText 导航栏标题文字
-
navigationStyle 导航栏样式,仅支持 default/custom
-
backgroundColor 下拉窗口背景颜色
-
backgroundTextStyle 下拉loading样式,仅支持 dark/light
-
enablePullDownRefresh 是否开始下拉刷新
-
onReachBottomDistance 页面上拉触底事件触发时距页面底部距离,单位只支持px
vue模块中自动导入
使用自动导入插件unplugin-auto-import
1.在项目命令行终端中执行如下代码
npm install unplugin-auto-import
2.根目录下创建vite.config.js,并拷贝下面的代码
import { defineConfig } from 'vite'
import uni from '@dcloudio/vite-plugin-uni'
import AutoImport from 'unplugin-auto-import/vite'
export default defineConfig({
plugins: [
uni(),
// 自动导入配置
AutoImport({
imports:[
// 预设
'vue',
'uni-app'
]
})
]
})
ios底部安全区域css环境变量
env(safe-area-inset-bottom)