TypeScript动态调用@prismicio/client方法报TS7053错误如何解决？

报错原因 #

TS 默认会把你定义的options对象里的predicate字段推导为普通string类型，而Prismic.Predicates只接受自身定义的合法谓词方法名作为索引键，普通string类型不能直接用来索引这个对象，所以抛出了7053类型错误。

解决方案 #

方案1：给options添加明确的类型约束（最推荐）

先从@prismicio/client类型定义中提取Prismic.Predicates的合法键作为类型，给options的predicate字段限定类型：

import Prismic from '@prismicio/client'

// 提取Prismic.Predicates所有合法方法名作为类型
type PredicateMethod = keyof typeof Prismic.Predicates;

const options = {
    // 限定predicate只能是合法的谓词方法名
    predicate: 'at' as PredicateMethod,
    path: 'document.type',
    value: 'page'
}

Prismic.Predicates[options.predicate](options.path, options.value);

如果你的options是动态生成的，也可以直接给整个options定义类型：

type PredicateOptions = {
  predicate: PredicateMethod,
  path: string,
  value: string | number | boolean | Date | Array<string | number | boolean | Date>
}
const options: PredicateOptions = {
  predicate: 'at',
  path: 'document.type',
  value: 'page'
}

方案2：调用时直接做类型断言（临时快速解决）

如果只是临时使用不想定义额外类型，可以在索引的时候直接断言predicate是合法键：

Prismic.Predicates[options.predicate as keyof typeof Prismic.Predicates](options.path, options.value);

方案3：给options加const断言（适合固定配置的场景）

如果你的options是写死的静态配置，直接加as const让TS把predicate推导为字面量类型'at'而不是通用string，也能解决问题：

const options = {
    predicate: 'at',
    path: 'document.type',
    value: 'page'
} as const;

内容的提问来源于stack exchange，提问作者Herzuull