类型动态 object 函数调用

Question

我有这个代码（ 游乐场）：

const routes = {
    projects: ({}) => "/projects",
    "projects.edit": ({ id }: { id: string }) => `/projects/${id}`,
    report: ({ projectId }: { projectId: string }) => `/report/${projectId}`,
};

type Routes = typeof routes;

export function generateUrl<Name extends keyof Routes>(
    name: Name,
    params: Parameters<Routes[Name]>[0]
): string {
    const fn = routes[name];
    return fn(params);
}

我在fn(params)行中收到此错误。 我将如何编写它来进行类型检查（不使用any ）？

类型'{ projectId：string; 中缺少属性'id' }' 但在 '{ id: string; 类型中是必需的 }'。

Answer 1

这是另一个解决方案
这允许您拥有采用多个参数的路由。

type Route = (...args: any[]) => string;
type Routes = {
    [index: string]: Route;
};

function createUrlGenerator<T extends Routes>(router: T) {
    return <K extends keyof T>(name: K, ...params: Parameters<T[K]>): string => {
        return router[name].apply(null, params);
    }
}

const routes = {
    projects: ({}) => "/projects",
    "projects.edit": ({ id }: { id: string }) => `/projects/${id}`,
    report: ({ projectId }: { projectId: string }) => `/report/${projectId}`,
    multyParams: (id: number, query: string) => `${id}/${query}`
};

export const generateUrl = createUrlGenerator(routes);

generateUrl('multyParams', 123, '43');
generateUrl('multyParams', 123); // Exception
generateUrl('projects.edit', { id: '123' });
generateUrl('projects.edit', { id: 123 }); // Exception

Answer 2

const routes = {
    projects: ({}) => "/projects",
    "projects.edit": ({ id }: { id: string }) => `/projects/${id}`,
    report: ({ projectId }: { projectId: string }) => `/report/${projectId}`,
};

type Routes = typeof routes;

export function generateUrl<Name extends keyof Routes>(
    name: Name,
    params: Parameters<Routes[Name]>[0]
): string {
    const fn = routes[name] as ((p: typeof params => ReturnType<Routes[Name]>);
    return fn(params);
}

见操场。

基本上，当从routes检索 function 时，TS 希望非常安全，并强制使用所有可能参数类型或{} & {id: string} & {projectId: string}的交集来调用检索到的值在这种情况下，它转换为{id: string, projectId: string} 。

这显然不是这里所希望的，所以我们使用类型安全的¹强制转换。

但是请注意，有一个缺点。 没有任何参数的'projects'路线的存在使得以下行可以：

fn(42)

如果这是一个问题，删除裸路由将解决它。

---

1：尝试用number替换typeof params 。