TypeScript：将函数参数值限制为动态变量中的数组值

type Options<P> = {
  pathname: string;
  rootPath: string;
  paths: P;
};

export const useLayoutPaths = <P extends string[]>(options: Options<P>) => {
  const { pathname, rootPath, paths } = options;

  if (paths.length === 0) {
    throw new Error("paths must be a non-empty array.");
  }

  const currentPath = pathname.substring(pathname.lastIndexOf("/") + 1);
  const value = paths.includes(currentPath) ? currentPath : paths[0];

  const getPath = (name: typeof paths[number]): string =>
    `${rootPath}/${String(name)}`;

  return { value, getPath };
};

const { value, getPath } = useLayoutPaths({
  pathname,
  rootPath: `/department/${orgId}`,
  paths: ["trends", "comments"],
});

console.log(getPath("trends")) <-- Only allow "trends" or "comments"

export const useLayoutPaths = <P extends string>(options: Options<P[]>) => {
   // impl
};

export const useLayoutPaths = <P extends string>(options: Options<P[]>) => {
  const { pathname, rootPath, paths } = options;

  if (paths.length === 0) {
    throw new Error("paths must be a non-empty array.");
  }

  const currentPath = pathname.substring(pathname.lastIndexOf("/") + 1);
  const value = (paths as readonly string[]).includes(currentPath) ? currentPath : paths[0];

  const getPath = (name: typeof paths[number]): string =>
    `${rootPath}/${String(name)}`;

  return { value, getPath };
};

console.log(getPath("trends")) // okay
getPath("oops"); // error!

Typescript相关问答推荐

TypScript错误：类型{ children：ReactNode; }与动态React组件中的IntrinsicLedger类型没有共同的属性

脉轮ui打字脚本强制执行图标按钮的咏叹调标签-如何关闭

类型脚本接口索引签名

有没有一种方法可以在保持类型的可选状态的同时更改类型？

将props传递给子组件并有条件地呈现它''

Webpack说你可能需要在Reactjs项目中增加一个加载器''

如何使用类型谓词将类型限制为不可赋值的类型？

嵌套对象的类型

有没有可能产生输出T，它在视觉上省略了T中的一些键？

Vue3 Uncaught SyntaxError：每当我重新加载页面时，浏览器控制台中会出现无效或意外的令牌

TypeScrip泛型类未提供预期的类型错误

如何将父属性类型判断传播到子属性

vue-tsc失败，错误引用项目可能无法禁用vue项目上的emit

如何按属性或数字数组汇总对象数组

字符串文字联合的分布式条件类型

重写返回任何

Typescript泛型调用对象'；s方法

TypeScript：如何使用泛型和子类型创建泛型默认函数？

Typescript：是否将联合类型传递给重载函数？

对象只能使用 Typescript 中另一个对象的键