可以通俗易懂的讲一下vue实现SPA的原理吗？

Question

之前的项目使用iframe实现SPA
点击一个链接在iframe里显示子页面，不刷新整个页面

vue是如何实现SPA的呢？搜索了很久，都是关于hash和pushstate的文章，没有深入的讲。

我们的项目有50个左右的页面，每个页面里有不少的js代码，vue如何做到加载不同的页面内容，还有如何处理ajax历史记录问题？

Answer 1

Vue 跟 SPA 没关系。

SPA 即单页应用，只需要根据用户要求渲染不同内容即可，用任何技术，只要能做到这一点，就可以。

Vue 提供了 v-if，v-show，<component :is=""> 等指令和组件，可以控制页面的呈现，它的 SPA 也是基于此实现的。

至于 hash 和 pushstate，则是为了记录用户位置，方便用户协同和记录自己工作状态用的。理论上用任何组件或工具都可以，但是 history 是最好用的。这方面一般建议用 vue-router。

至于老项目改造，建议你从 vue-router 入手，先改造一个页面，后面循序渐进即可。