前后端分离学习笔记(1) ---[Vue基础]

前后端分离学习笔记(1) ---[Vue基础]

文章目录

• • 1.关于前后端分离
  • 2. vue基本学习
  • 3.vue-cli 搭建项目
  • 4.页面路由
  • 5.ElementUI
  • 6.Axios异步通信

建议官方文档学习 VUE2.0版本在线文档

1.关于前后端分离

• 前端 html 页面通过 ajax 调用后端的 restuful api 接口并使用 json数据进行交互.
• 前端服务器使用 nginx/tomcat。前端/WEB服务器放的是 css，js，图片等等一系列静态资源，前端服务器负责控制页面引用,跳转,路由.
• 可以减少后端服务器的负载压力,因为分离之后;接口以外的其他所有 http 请求都转移到前端服务器了.
• 可快速区分问题;后端–>接口数据出错，数据没有提交成功，应答超时…;
  前端—>页面逻辑，跳转错误，浏览器兼容性问题，脚本错误，页面样式问题…
• 即使后端服务暂时超时或宕机，前端页面也会正常访问.
• nginx 支持页面热部署，不用重启服务器，前端升级更无缝.
• 增加代码的维护性和易读性;接口完全可以共用，如果也有手机app 相关的服务，那么只要通过一些代码重构，也可以大量复用接口，提升开发效率.
• 在 nginx 中部署证书，外网使用 https 访问，并且只开放 443 和 80 端口，其他端口一律关闭（防止黑客端口扫描），内网使用 http，性能和安全都有保障

MVVM结构

2. vue基本学习

用于构建用户界面的渐进式框架. 与其它大型框架不同的是，Vue 被设计为可以自底向上逐层应用。Vue 的核心库;它只关注视图层;
基本学习的话建议看着官方文档跟随学习;—> VUE2.0版本在线文档

之前也有记录在B站学习的Vue基础入门学习笔记—>B站学习Vue入门笔记

比如说,那个v-for指令,这次我试了个双重循环的;

	
		
		
		
		
	
	
		
			
				编号
				姓名
				年龄
				公司ID
				部门
				
					{{index+1}}
					{{u.name}}
					{{u.age}}
					{{a.id}}  
					{{a.part}}  
									
										


					

						
欢迎分享，转载请注明来源：内存溢出
原文地址: http://outofmemory.cn/zaji/5680726.html