后端返回的数据层次与前端可用的数据层次不一样,每次都要写两个interface

Delete
  • 131

后端返回的数据层次与前端可用的数据层次不一样,每次都要写两个interface。在保持后端数据层次不变的基础上(有一些老项目没有用ts),怎么优雅的维护两个interface?或者有什么其他的办法?

回复
阅读 887
2 个回答

只能提取公用的继承了吧?

说一些我在项目中遇到的情况供参考。

例如在项目开始时接口返回结构是

interface A1 {
    user_id: string;
}
// 请求接口
const a: A1 = await Vue.axios.get('/path/api');

后来返回的结构成了

interface A2 {
    // user_id字段变成了id
    id: string;
}
// 接口请求
const a: A2 = new A2(await Vue.axios.get('/path/api'));
// 其中class A2定义为
class A2 {
    id: string;
    public constructor(raw: A1) {
        this.id = raw.user_id;
    }
}

主要是想把后端数据结构A1相关的影响限制在接口请求代码这部分,在逻辑代码部分只使用A2,不使用A1。

另外听说还有这样做的:用代码解析后端接口文档中的返回数据示例生成interface定义代码,也是一种办法。

你知道吗?

宣传栏