快捷搜索: 王者荣耀 脱发

后端初学者如何快速使用Vue搭建前端环境

引言

对于一个后端初学者来说,如何快速的搭建一个前端环境是一个难题,毕竟后端Java中也有非常多的知识等着我们学习。Vue这个JS框架大家应该不会陌生,Vue使用组件化编程,对于学习前端并且热衷于编写组件的同学们来说,组件复用可是一件非常爽的事情,但是对于后端的同学们来说可就是一件头疼的事情了。虽然Vue号称十分容易入门,但是要学习到能独立写一个前后端分离的项目也是一件难事。

使用Vue+静态模板进行前端搭建

Vue使用数据双向绑定进行页面数据的更新。在我以往使用JQuery与Ajax对前端进行数据渲染时,总要写一大段的JS逻辑,使用JQuery的map方法遍历列表,并且将拿到的数据拼凑在HTML语句中,最后使用dom将其添加在指定的地方,对于这种方法,初学者可能会更加的迷惑。 我们可以使用Vue的语法结合一些前端模板。来快速搭建前端环境,不过这样使用Vue是有问题的,因为没有使用Vue-cli,导致前后端交互所使用的token无法进行保存,这时我们可以想到使用cookie来保存token,为了防止跨域问题,前后端分离的项目是不允许传递cookie的,因此我们可以使用JSCookie这个JS-API来保存token在本地(LocalStorage与SessionStorage也可以保存)。

前后端分离?

这种前后端分离的方式事实上是一种取巧的方式,毕竟目前大多数前后端分离的应用都是前端服务器+后端服务器的模式,并且目前后端分离的更加彻底(微服务以及分布式),在我进行具体使用时,我是在一台机器上进行部署,后端SpringBoot采用8080接口,前端使用了另一个接口,这样看起来其实也算前后端分离。

经验分享 程序员 微信小程序 职场和发展