vue-实战练习 借助element-ui组件搭建一个主页

element-ui中文文档
vue练习源码
本项目仿照航天云网主页进行练习
有以下部分模仿得不是很好，会在后续的学习中慢慢进行补充

1. 某些小图标没有进行模仿，例如右上角的HOT等小图标
2. 在”工业信息互联 供需精准对接“ 部分，有两种形式，一种是利用element-ui的表格形式，但是在右边的详情处暂时无法实现特定链接跳转 第二种是利用分割线进行表示 虽然能实现特定链接 但是太丑了 ，以后可能会多研究一下关于表格的element-ui的源码来解决这个问题
3. 对于标签页的使用存在着只能通过控制栅格的长度来控制标签页的线的长度，目前没有找到可以解决的办法
4. “工业大数据” 处的 “点击我了解详情” 的弹出框 会遮挡到标签页的点击，暂时没有想到解决办法
5. “云制造产业集群生态” 模块点击左侧按钮实现右侧地图的特定显示没有去实现 应该是会点击按钮会生成新增一个类 来实现右侧的图形显示 目前不太能够想清楚怎么在 那个地图上进行展示图片（地图做背景图片 ， 后面尝试一下）
6. 跟随滚动条左右两侧的信息没有制作，目前只应用了element-ui组件中的回到顶部组件，后面在思考怎么去实现。

练习时遇到的问题
1.从vue init webpack “dirName” 到npm安装sass就不说了 不清楚的小伙伴可以去vue进阶学习 去查看
2.问 : 遇到的第一个问题 为什么vue-cli的helloworld 可以 直接打开而自己创建的vue却不行
答：在网页的首页直接打开需要 vue-router的path设置为根目录，即path：”/“
，path表示在vue的网页中访问的路径。
3.问：走马灯组件如何让添加图片
答：走马灯组件图片添加
4.问：修改elementui标签页的字体等
答：修改elementui标签页
5. 问：ElementUI layout中gutter与offset的区别
答：gutter是指栅格间间隔，offset是指栅格左侧的间隔格数 ，gutter的间隔不是格数，是距离 ，offset是格数。
6.问：vue-router路由设置问题
关于路由设置的一点建议：在一个大的项目中，往往具有很多组件需要导包，因此在每一个router-view 都加一个name，尽量不使用默认路由，这样也可以使得整个项目的逻辑变得更加清晰。
答：vue-router官方文档
（1）在配置路由时，会遇到同时具有子路由和同级路由的情况。当这一级的路由只有一个时使用component（单数形式），当这一级别有多个路由时使用components（复数形式）。
（2）路由中的components和children，我们在配置时，只需要关注其上下级关系即可，只需要考虑它的父路由是哪一级路由，只需要放在那一级路由的children里就可以了。
7.问：如何实现点击element-ui按钮触发相应事件
答：在el-button上添加@clock属性即可，同时在methods中添加绑定的事件函数即可，如果要实现网页跳转
window.location.href = "http://www.baidu.com"; 在本页面跳转到指定页面
window.open( "http://www.baidu.com"); 打开新的标签页跳转到指定页面
8.问：纵向分割线的怎么延长
答：在页面中通过检查元素可以发现，其类名是.el-divider–vertical 在对应的vue模板中的css样式表修改其高度即可
在对分割线的位置也有一定要求时间，建议把分割线也放置到栅格系统中使得更加美观
9.问：element-ui 的el-table 的问题
答：以后在使用时，尽量使用带有插槽的table，对其中的字体等的修改更加方便
10.问：修改el-button的样式
答：el-button的类名为.el-button 可以直接对CSS进行修改，但是要注意 同一个模板中的所有按钮都是.el-button 需要限定是哪里的按钮
11.问：底部点击链接的颜色变化
答：通过设置a标签中的hover visited active 和link四种伪标签进行设置