1. 获取路径传参，类似小程序，在onLoad接受参数。没有vue中的query和param

   // 路径 /pages/index/index?a=1&b=2
   onLoad(config) {
       const { a, b } = config
   }
   复制代码

2. uni-app内置vuex，但不支持vue-router

3. easycom（自动引入组件且是按需引入）

   从插件市场安装的组件默认是easycom，自定义组件可用正则匹配

   "easycom": {
     "^u-(.*)": "@/uview-ui/components/u-$1/u-$1.vue",
     "comp": "@/pages/index/comp"
   }
   复制代码

4. 生命周期（以下为全端支持），原则上应当页面使用页面的生命周期，组件用组件的生命周期，不能混用

   • 应用生命周期，仅能在App.vue中监听

     函数名	说明
     onLaunch	当uni-app 初始化完成时触发（全局只触发一次）
     onShow	当 uni-app 启动，或从后台进入前台显示
     onHide	当 uni-app 从前台进入后台
     onUniNViewMessage	对 nvue 页面发送的数据进行监听，可参考 nvue 向 vue 通讯

   • 页面生命周期

     函数名	说明
     onLoad	监听页面加载，其参数为上个页面传递的数据，参数类型为Object（用于页面传参）
     onShow	监听页面显示。页面每次出现在屏幕上都触发，包括从下级页面点返回露出当前页面
     onReady	监听页面初次渲染完成。注意如果渲染速度快，会在页面进入动画完成前触发
     onHide	监听页面隐藏
     onUnload	监听页面卸载
     onPullDownRefresh	监听用户下拉动作，一般用于下拉刷新
     onReachBottom	页面滚动到底部的事件（不是scroll-view滚到底），常用于上拉加载下一页数据。如使用scroll-view导致页面级没有滚动，则触底事件不会被触发
     onPageScroll	监听页面滚动，参数为Object

   • vue组件生命周期

   页面也有组件的生命周期，但是组件没有页面的生命周期

   页面生命周期中，onload不能直接访问dom，onready可以

    // 在一个页面中同时有页面生命周期和组件生命周期
    created() {
      console.log('create')
    },
    onLoad() {
      console.log('load')
    },
    beforeMount() {
      console.log('beforemount')
    },
    beforeCreate() {
      console.log('beforecreate')
    },
    onReady() {
      console.log('ready')
    },
    mounted(){
      console.log('mounted')
    },

    // h5、app中顺序
    // beforecreate -> load -> create -> beforemount -> ready -> mounted
    
    // 微信和支付宝小程序中顺序
    // beforecreate -> create -> beforemount -> load -> mounted ->ready
复制代码

    // 页面
    onLoad() {
      console.log('load')
    },
    onReady() {
      console.log('ready')
    }
    // 组件
    beforeCreate() {
      console.log('comp-before-create')
    },
    beforeMount() {
      console.log('comp-before-mount')
    },
    created() {
      console.log('comp-create')
    },
    mounted() {
      console.log('comp-mounted')
    }
// h5、支付宝小程序、app中顺序
// load -> comp-before-create -> comp-create -> comp-before-mount -> comp-mounted -> ready

// 微信小程序中顺序
// comp-before-create -> comp-create -> comp-before-mount -> load -> comp-mounted -> ready
复制代码
复制代码

5. 条件编译

   // #ifdef H5 || MP-WEIXIN
   h5和微信小程序平台特有
   // #endif
   
   // #ifndef APP-PLUS || MP-ALIPAY
   app和支付宝小程序之外的平台特有
   // #endif
   复制代码

   不同文件使用不同注释方式，js使用// 注释，css使用/* 注释 */，vue模板使用

   静态资源static目录下也可使用条件编译，只要目录名为对应平台名就可以实现条件编译

   条件编译不区分安卓和ios，使用uni.getSystemInfo区分二者

6. socped

   h5默认开启scoped，其它平台未开启

7. v-html

   小程序不支持v-html

8. 组件命名

   建议加上前缀防止冲突（不能是u和uni，微信小程序不能使用wx）

9. 组件样式

   如果直接在父组件在子组件上使用class且class不是子组件的prop，在支付宝小程序处无效。父组件为子组件添加样式时，需要外面使用一个原生的组件比如view

10. 对原生的组件，例如view、text设置ref，在小程序中为undefined，h5、app正常。封装的组件能正常使用。

11. 使用position:fixed;且bottom:0;或top:0;时，h5端表现为fixed元素与标题栏或导航栏重叠。原因为在h5端标题和导航都是一个组件，可用窗口大小包括二者。可使用uni.getSystemInfo获取系统信息，在h5和app中会有windowTop和windowBottom两个参数表示可用窗口顶部和底部位置。使用条件编译动态的设置top和bottom的值。

12. promise

    框架进行promise封装的部分api（例如uni.request），回调参数是一个数组，第一项为错误信息，第二项是返回的数据。

13. css如果使用本地图片路径和本地字体路径，需要使用~@开头的绝对路径~@/static/imgs/a.png。40k以下的本地图片或字体会被转换成base64，超过的需要使用网络资源。

uview-ui

1. 小程序中u-input和u-field使用v-model后不支持vue的修饰符（trim，number，lazy），其中trim会报错 “Property or method "$$v" is not defined on the instance but referenced during render”。组件提供trim属性。

2. 支付宝小程序使用u-cell-item组件且未使用label属性时，会报错 “TypeError: Cannot read property 'label' of undefined”。在u-cell-item源码28行处理。