uniapp整体框架和知识点

uniapp介绍：

• 一套代码可以运行在多个平台
• 扩展灵活，学习成本低

一、框架

uniapp的配置

1、page.json

globalStyle : 用于设置应用的导航条、标题、窗口背景色等。

pages： 这个节点配置应用由哪些页面组成
pages节点的第一项为应用入口页（即首页）参考
style:用于设置每个页面的导航条、标题、窗口背景色等。

{
    "pages": [
        {
            "path": "pages/index/index", 
            "style": { ... }
        }, {
            "path": "pages/login/login", 
            "style": { ... }
        }
    ]
}

tabBar：配置项指定一级导航栏，可以当成底部导航栏，参考
只能配置最少2个、最多5个 tab
uni.scss： 整体控制应用的风格的控制，可以使用变量，嵌套
App.vue：是uni-app的主组件，所有页面都是在App.vue下进行切换的，是页面入口文件
main.js ：是uni-app的入口文件，主要作用是初始化vue实例、定义全局组件、使用需要的插件如vuex

生命周期

应用生命周期

应用生命周期仅可在App.vue中监听，在其它页面监听无效：

1. onLaunch： 当uni-app 初始化完成时触发（全局只触发一次）
2. onShow：从后台进入前台显示
3. onHide ：当 uni-app 从前台进入后台

页面生命周期

1. onLoad：监听页面加载，其参数为上个页面传递的数据，参数类型为 Object（用于页面传参）
2. onUnload：监听页面卸载
3. onShow：监听页面显示，页面显示在屏幕上即触发
4. onHide：监听页面隐藏
5. onReady：监听页面初次渲染完成

组件生命周期

即vue的组件生命周期
参考：https://uniapp.dcloud.io/collocation/frame/lifecycle?id=%e7%bb%84%e4%bb%b6%e7%94%9f%e5%91%bd