50-VUE_Rebuild-1

声明：关于vue的大部分的知识都差不多掌握了，现在要把jsp全部给改写成vue，每天来写一下重写了哪些东西

1.安装stylus

为了减少代码，在这里还是使用stylus-->css的预处理器

npm install stylus --save

npm install stylus-loader --save

安装2项，stylus & stylus-loader

如果重写jsp，那么其中很多的css样式，第三方的东西，建议就不要花时间去搞了，毕竟你不是专业前端，在css上可能会花费很多的时间，尽量能简单就简单，关于stylus，其实就是一个称之为"css预处理器"，给css加了一些函数特性，然后语法的话，也省略了一些大括号阿，冒号之类的，其实这种符号根本没有省略的必要，符号才多少代码，不过还好可读性也还行，缩进式的语法，但是最主要的是，国内关于stylus的讲解比较少，自己对css的什么伪类，不熟...所以还是少碰css为好

2.配置main.js

①Vue.config.productionTip = false

选false，否则你生产调试的时候会出现很多没有必要的提示，警告等

②把app.vue加载到main.js中，有2种，这里不需要用render函数，那就不用=>那个加载app的函数了

3.替换js，css

这里引用了easyUI和layUI的一系列js和css，这里全部给换了，所有的控件，全部给改成element-ui了

4.先写登录的ui

①下载element-ui

②下载完成以后的插件，在package-json里面都是有的

③写好了form然后设置样式

④关于stylus的使用。。随便写了点东西，这个demo太少了。。加上不懂css选择器什么的，能少用就少用

5.img & button

同样，加上element的button和img，然后这里注意一下

img的src是可以写一个请求的，这里不太清楚是否为ajax，但是可以这样写

就等于向后台发送了一个http请求，在这里图片的数据，就是通过这个请求发送了以后返回到response的域对象中

照理来说，肯定不能这样干阿，肯定要异步懒加载的方式加载图片，就像android的ImageLoader一样

6.跨域问题

在console里面发现了有跨域访问的提示，今天还没注意是不是真的解决了跨域访问

我们在config的index.js里面，把 proxyTable里面写上跨域的域名等配置信息，写上跨域的域名，这是前端解决跨域访问的做法，我们明天看看如何在后台解决跨域访问的问题。

7.<title>标签

在vue文件里面是不能写title标签，因为。。。没有。。。我佛了。。。

小结：

今天其实还解决了一些基本的spring的配置代码，然后对vue的写法，好歹实际写了一下，确实有点不习惯脚本语言，总感觉写的有点随意了，明天接着整页面，明天该要弄shiro了，毕竟这个东西现阶段的框架就要用到了