uni-app icon indicating copy to clipboard operation
uni-app copied to clipboard

常用API(request等)支持泛型

Open Alicia0818 opened this issue 1 year ago • 4 comments

新功能描述

常用API(request等)支持泛型,用来约束返回值

现状及问题

// @/hooks/request/index.ts  基于uni.request封装API
interface RequestSuccessCallbackResult<T extends string | Record<string, any> | ArrayBuffer = string | Record<string, any> | ArrayBuffer> {
    cookies : string[]
    data : T
    errMsg : string
    header : Record<string, any>
    statusCode : number
}

/** 真实数据结构 */
interface ResponseDataProduct {
    count : number
    status : number
    productList : {
        id : number
        name : string
        cover : Array<string>
        price : number | string
        [key : string] : any
    }
}

export const getProductList = async (options : { page : number } = { page: 1 })
    : Promise<RequestSuccessCallbackResult<ResponseDataProduct>> => {
        return uni.request({ data: options, url: 'product/lists' })
        // 报错:属性“data”的类型不兼容。
        // 不能将类型“string | ArrayBuffer | AnyObject”分配给类型“ResponseDataProduct”。
}

以上封装会报错

尝试方案

微信request的声明文件及接口如下:

request<T extends string | IAnyObject | ArrayBuffer = string | IAnyObject | ArrayBuffer>( option: RequestOption<T>): RequestTask;

interface RequestOption<T extends string | IAnyObject | ArrayBuffer = string | IAnyObject | ArrayBuffer> {
    url: string
    data?: string | IAnyObject | ArrayBuffer
    ...
    success?: RequestSuccessCallback<T>
    ...
}

type RequestSuccessCallback<T extends string | IAnyObject | ArrayBuffer =  string | IAnyObject | ArrayBuffer> 
    = (result: RequestSuccessCallbackResult<T>) => void;

interface RequestSuccessCallbackResult<T extends string | IAnyObject | ArrayBuffer = string | IAnyObject | ArrayBuffer> {
    cookies: string[]
    data: T
    header: IAnyObject
    ....
}

补充信息

在项目根目录下新建global.d.ts文件

// global.d.ts
export declare global {
    interface Uni {
        request<T extends string | IAnyObject | ArrayBuffer = string | IAnyObject | ArrayBuffer>( option: RequestOption<T>): Promise<T>;
    }
    // 参考【尝试方案】中的代码补全,即可全局支持泛型:
    // uni.request<ResponseDataProduct>({ data: {}, url: '' })
}

也尝试过在 interface Uni {} declare UniNamespace {} 内重写 RequestOptionsRequestSuccessCallbackResult接口,但是并不能生效 希望官方能更新常用接口的声明文件以支持泛型

Alicia0818 avatar Dec 20 '23 10:12 Alicia0818

@StrivingRabbit #https://github.com/wechat-miniprogram/api-typings/issues/177

Alicia0818 avatar Dec 20 '23 10:12 Alicia0818

感谢你的反馈,之后会考虑添加泛型

18148764734 avatar Jan 10 '24 07:01 18148764734

3.4.7 已新增 getStorage、getStorageSync 的泛形支持。但是 request 目前还没有很好的办法可以支持,用户可以在代码中自行处理一下。待后续完善 request 后关闭此 issue

StrivingRabbit avatar Jan 11 '24 03:01 StrivingRabbit

感谢你的反馈,下版本会为request添加泛型

内置Pinia使用CompositionAPI语法类型推断BUG

Alicia0818 avatar Feb 01 '24 08:02 Alicia0818