谁说前端不能像后端一样进行数据预处理

109 阅读2分钟

我正在参加「掘金·启航计划」

关于数据预处理的启发主要来自后端自定义类型转换器

先解释一下自定义类型转换器是一个什么的概念,和它的一些使用场景

自定义类型转换器主要是一个自动将请求参数转换为目标方法的参数类型

通俗的讲就是它是一个中间者,在接口接收到参数之前,会进行一些自定义数据类型转换的操作的过程,然后接口接收到这些处理后的数据

简单例子:

发送请求:localhost/setDate?date=202010101111
##这样发送过去的是一个整型,但后端实际想要的是一个Date类型,这个时候就可以通过自定义类型转换器来实现整型转换成日期类型了,就不用进行额外的处理

以此类推,我们也可以基于axios的拦截器实现,数据预处理的功能

axios.interceptors.response.use(response => { 
    // 对响应数据进行处理,并将处理好的数据返回
    return typeConverter(response,type);
}, error => { 
    // 响应错误处理 
    return Promise.reject(error);
});

function typeConverter(value,type){
//进行类型转换处理
...
}

主要场景:

  1. 就是前端是有分多个平台的时候,pc端和移动端的数据结果集不一定是要相同,然后就可以基于该平台进行数据预处理,返回自己当前平台需要的数据类型
  2. 多个后端意见不一致,各返回各的蜜汁操作的时候,你就可以用这个来进行处理,管他们有多少种格式,到你这里处理完就是一种格式

应该还有其他应用场景可供开发了,具体还是看需求实现。也不一定要用axios拦截实现,其实也可以lodash或者vue的生命周期实现该功能