前后端数据交互-优化|页面加载中...|泛型方法|枚举

原创

已于 2022-01-19 23:16:34 修改 · 978 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#交互 #前端 #javascript

于 2021-12-17 10:59:55 首次发布

本文探讨了前后端数据交互的优化策略，包括在数据读取时显示加载页面，以及后端返回数据的统一格式。通过使用枚举来规范状态码，并通过泛型方法确保前端接收的数据类型一致。枚举的四种访问修饰符、静态常量及枚举类的特性被详细阐述，同时介绍了泛型方法在处理后端返回数据不统一问题上的应用。

前后端数据交互-优化

1 数据正在读取-页面（loading函数）

背景：数据从服务器读取速度慢，给个反应：加载中页面，用户体检好
代码执行：至上而下，先出现加载页面，获得数据完成，关闭加载页面

then–catch–finally 同 try–catch–finally
请求成功，做什么？----出错，做什么？----无论成败，都得做什么？（关闭加载页面）

methods:{
   
   
			getTableData(){
   
   
				const loading = this.$loading({
   
   
					lock: true,
					text: '页面正在加载中...',
					background: 'rgba(0,0,0,0.7)'
				})
				this.$axios.request({
   
   
					url: '/ums-user/page',
					method: 'get',
					params: this.params
				}).then(response => {
   
   
					this.tableData = response.data
				}).catch(Error => {
   
   
					console.log(Error)
				}).finally(() => {
   
   
					loading.close()
				})
			}

2 枚举（统一后端返回给前端的数据格式）

背景：后端返回给前端数据类型不一:boolean、集合等 ==》后端向前端返回数据必须统一：返回值（状态码，信息（状态码辅助解释），真正返回数据值（泛型））

2.1 4种访问修饰符

		本类	本包不同类	不同包的子类	不同包
公共场合	public：方法	√	√	√	√
房子能让孩子住	protected：被子类继承的方法	√	√	√
夫妻房产证	默认（不写）	√	√
身份证	private：属性	√

2.2 Static final 优先加载并且不可变------------常量

Static final +变量（基本数据类型/引用数据类型）= 常量
public static final 作用域：全局+优先加载+不可变

基本数据类型：值不能变

Static final int A(大写) = 1； A的值不能变，只能为1

引用数据类型：地址不能变，值可以变

Static final int[] ARR = new int[10

最低0.47元/天解锁文章