uni-app 注意事项

1. 根目录 static文件夹 存放应用引用静态资源（如图片、视频等）的目录，注意：静态资源只能存放于此

2. components文件夹 组件目录

3. hybrid 存放本地网页的目录

4. pages.json 配置页面路由、导航条、选项卡等页面类信息

5. css、less/scss 等资源同样不要放在 static 目录下，建议这些公用的资源放在 common 目录下。

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

7. onTabItemTap常用于点击当前tabitem，滚动或刷新当前页面。如果是点击不同的tabitem，一定会触发页面切换。

8. uni-app路由全部交给框架统一管理，开发者需要在pages.json里配置每个路由页面的路径及页面样式，不支持 Vue Router。

9. uni-app 推荐使用rpx单位

10. uni-app 中以下组件的高度是固定的，不可修改：

组件	描述	5+App	H5
NavigationBar	导航栏	44px	44px
TabBar	底部选项卡	56px	50px

 

11. 建议使用flex布局

12. 注意数据和事件绑定的差异，使用时应按照 vue 的数据和事件绑定方式

• 属性绑定从 attr="{{ a }}"，改为 :attr="a"；从 title="复选框{{ item }}" 改为 :title="'复选框' + item"
• 事件绑定从 bind:click="toggleActionSheet1" 改为 @click="toggleActionSheet1"
• 阻止事件冒泡 从 catch:tap="xx" 改为 @tap.native.stop="xx"
• wx:if 改为 v-if
• wx:for="{{ list }}" wx:key="{{ index }}" 改为`v-for="(item,index) in list"

13. 优化建议：

    1. 使用自定义的组件，把单页面分为多个小组件

    2. 不用大图，尽量压缩、延时渲染图片

    3. 优化数据更新 不是数据渲染的变量不放到data里

14.  uni-app 自带免费统计平台、 广告、推送

15. 开发规范：（uni-app 使用vue的语法+小程序的标签和API。）

1. 页面文件遵循vue
2. 组件标签靠近小程序
3. 接口能力靠近微信小程序
4. 数据绑定及事件靠近vue.js
5. 页面的生命周期补充了vue的页面生命周期
6. 应用生命周期补充了小程序的应用生命周期
7. 建议使用flex布局开发