1.生成vue模板
输入vue直接生成
如果不生效，点击设置，代码片段，新建全局代码片段文件，输入vue的代码
2.下载ElementUI
先终止程序:ctrl+c
在ElementUI中找到安装指令复制到终端
npm i element-ui -S
3.引入element配置
在main.js中引入即可，去element Ul官网中引入
如果不加那三个router-link，浏览器就不会显示首页，关于，Test这三个字，那么router-view就代表了页面的父容器，子容器就不存在了，但是如果还想跳转就得在网址后面加/about跳转到对应页面
页面发生变化就是通过router-view标签变化的，router-link只是一个点击事件，相当于在页面可视化一个超链接的文字展示
在views中新建一个Test.vue，生成vue模板，然后写内容，之前在App.vue写了下面的点击事件
不会生效，因为我们还需要在rooter里面的index.js中写跳转规则
然后所写内容就会显示在浏览器了
上面三行代码就是跳转页面的关键配置，即使没有在App.vue中写router-link点击事件也会跳转，只是需要手动在浏览器标题上把网址拼接上
在Test.vue中实现两个输入框内容同步改变
在data中返回message信息，然后让两个输入框绑定上相同元素
data可以理解为model，template中内容可以理解为view
data中的message是数据，v-model是视图
数据变 视图跟着变，如果message写213645，浏览器视图也就是一样的数字
插值语法:
v-model只能写在属性中，不能放在h1的文本中，如果想让h1中的内容也绑定同步数据，可以使用插值语法{{message}}
v-model只适用于表单元素
{{表达式}}，表达式里面可以写1+1会直接计算返回在浏览器中，也可以写new Date()，自动将当前日期展示在浏览器
什么是vue?
数据+视图 数据绑定到指定的视图
页面中的每个标签都可以称为dom元素
Directives:指令
DOM Listeners:只要数据改变，dom监听到就会渲染到视图
数据变页面变 页面变数据变-------双向改变
在h1标签中写v-text="message"，也能实现插值那样的效果，同步数据
v-text和v-html的差别?
v-html会解析并渲染
v-text就是普通文本
事件绑定
事件需要再method中实现，我们定义一个方法名add(){
获取count必须用this调用
}
调用一次方法count自增1
希望点击一次图片调用一次count自增，img中绑定事件用v-on:click
点击时自动调用add方法
v-if中是布尔值类型 true false
可以将ELement UI中的组件直接引入到Test.vue中，实现图片轮播效果，选择走马灯模板
生命周期钩子函数:创绑更销
