上一篇文章带大家了解了Vue框架项目实战整理:1、快速启动Vue、开发工具介绍

项目创建成功后在浏览器中打开项目。

Vue框架项目实战整理:4、Vue项目执行流程分析(二)

进入页面首先加载index.html和main.js文件。、

main.js文件中给id=“app”的div创建一个Vue的实例,该实例中有一个名叫“APP”的组件,该组件通过vue-router将Hello.vue中的模板注入到App.vue的模板中。

index.html

Vue框架项目实战整理:4、Vue项目执行流程分析(二)

 main.js

Vue框架项目实战整理:4、Vue项目执行流程分析(二)

App.vue

Vue框架项目实战整理:4、Vue项目执行流程分析(二)

router文件夹下的index.js

Vue框架项目实战整理:4、Vue项目执行流程分析(二)

最后就是Hello.vue

Vue框架项目实战整理:4、Vue项目执行流程分析(二)

 

注此博客参考地址:

https://www.cnblogs.com/hello-wuhan/p/6961948.html

相关文章: