Uni-app 学习1

下载安装编译器略过，根据步骤慢慢安装就行。

首先认识uniapp项目结构

── pages # 存放所有的页面

── static # 存放静态资源，比如图片/视频/字体/图标等

── App.vue # 项目根组件，页面都是在App.vue下进行切换的，可调用应用的生命周期

── manifest.json # 应用的配置文件，用于指定应用的名称/图标/权限等

── pages.json # 全局配置，决定页面文件的路径/窗口样式/原生的导航栏/底部的原生 tabbar 等

── uni.scss # 本文件里预置了一批 scss 变量预置，如按钮颜色/边框风格，

从pages.json

    "pages": [   // pages 是一个数组，第一项就是启动页
        {
            "path": "pages/index/index",
            "style": {
                "navigationBarTextStyle": "white",
                "navigationBarTitleText": "hello-uni",
                "navigationBarBackgroundColor":"#2B9939"
            }
        }
    ]

pages.json 有提供 tabBar 配置，如果需要多个 tab ，那么可以通过 tabBar 配置项指定一级导航栏，以及 tab 切换时显示的对应页。不仅可以快速开发导航，而且能够提升性能。因为底层原生引擎在启动时无需等待 js 引擎初始化，可直接读取 pages.json 中配置的 tabBar 信息，渲染原生 tab。

• pagePath 是页面路径

• iconPath 配置未选中的图标

• selectedIconPath 配置选中后显示的图标

• 使用了 tabBar 后，页面跳转得用 switchTab，不能用 redirectTo 和 navigateTo 了。

出错点： 每个界面都要配置pages

遗漏点：  配置成功之后，运用内置网页，达到导航效果，但是运行到微信小程序，没有效果

uni第一节结束，开始搬砖~