vue做混合式app_【转载】Vue+原生App混合开发

项目的大致需求就是做一个App，里面集成各种功能供用户使用，其中涉及到很多Vue的使用方法，单独总结太麻烦，所以通过这几篇笔记来梳理一下。原型图如下：

路由配置

主界面会用到一些原生App方法，比如验证用户身份等，故由原生App完成，进去的每个模块则全部都是HTML页面(有一种后端工作好轻松的感觉￣へ￣)。由于传统的HTML页面开发起来效率太低，所以我选择了Vue来实现。每一个功能对应一个路由，比如电脑报修对应/repair,repair这个路由下的子页面都放进子路由里。

为了减小打包时的体积，在加载组件的时候采用了以下形式：

这是按照官方文档提供的路由懒加载技术写的，这样就能实现当路由被访问的时候才加载对应组件。以上是项目中关于路由的一些用法。

注册全局组件

接下来是全局组件的用法，比如头部，等待加载，弹出层之类的组件，几乎每个页面都有，全局注册能省去不少事。

之后在每个页面中敲入就能直接使用了，不用每次都去import。

处理返回键

还有一个比较常见的问题，由于Vue做出来的页面是一个SPA，在Android机中如果按下了物理返回键，整个应用都会退出，解决方法是重写物理返回键，这样就能按路由一级一级地返回了。因为主界面是由原生实现的，所以Vue只能返回到对应模块的首页，比如从 /repair/apply -> /repair -> null ，想要回到原生主界面，需要后端向前端注入一段脚本，在模块首页的后退