前端框架系统架构设计文档

1.创建vue项目的两种方式

1.CDN方式，直接下载并用

<script src="https:///npm/vue@2.5.22/dist/vue.js"></script>

2.NPM方式

在用 Vue 构建大型应用时推荐使用 NPM 安装[1]。NPM 能很好地和诸如 webpack 或 Browserify 模块打包器配合使用。同时 Vue 也提供配套工具来开发单文件组件。

搭建脚手架的步骤：

1.安装node.js

2.安装cli脚手架

3.利用脚手架创建一个vue项目

4.运行vue项目

2.项目结构分析

3.组件注册

1.注册全局组件

2.注册局部组件

这里的components里面的users要加上“ ”号

4.css样式作用域

5.属性传值

1.父组件向子组件传值

2.传值和传引用

传引用，一个地方发生改变所有的地方都会发生改变，传值的话一个地方发生改变别的地方不会发生改变3.子组件向父组件传值

6.生命周期（钩子函数）

beforeCreate:function () {
      alert("组件实例化之前执行的函数");
    },
    created:function(){
      alert("组件实例化完毕，但是页面还未显示");
    },
    beforeMount:function () {
      alert("组件挂载前，页面仍未展示，但虚拟Dom已经配置");
    },
    mounted:function () {
      alert("组件挂载后，此方法执行后，页面显示")
    },
    beforeUpdate:function () {
      alert("组件更新前，页面仍未更新，但虚拟Dom已经配置");
    },
    updated:function () {
      alert("组件更新后，此方法执行后，页面显示")
    },
    beforeDestroy:function () {
      alert("组件销毁前")
    },
    destroyed:function () {
      alert("组件销毁后")
    }

7.路由和Http

1.配置使用路由：

进入当前创建的项目安装路由模块

在main.js中引入路由模块

2.配置使用http