当传递道具到React组件时，我也遇到了类似的问题。

原因:我在myArray上的类型推断没有正确工作

https://codesandbox.io/s/type-string-issue-fixed-z9jth?file=/src/App.tsx

特别感谢Reactiflux的Brady在这个问题上的帮助。

Typescript 3.4引入了新的'const'断言

您现在可以防止文字类型(例如。'橙色'或'红色')被“拓宽”为使用所谓的const断言的类型字符串。

你将能够做到:

let fruit = 'orange' as const;  // or...
let fruit = <const> 'orange';

然后它就不会再变成字符串了，这就是问题的根源。

你也可以在整个对象上这样做:

let animals = [ { species: 'dog' }, { species: 'cat' } ] as const;

type firstAnimal = (typeof animals)[0]['species'];  // string literal 'dog'

额外提示:你也可以使用<const> false或<const> true来表示一个必须为真或假的布尔值。这在有歧视的工会中有时是有用的。你一看到就知道了。

这个问题被标记为Angular，尽管它实际上与Angular没有任何关系。然而，有(至少)一个Angular特定的情况，你可能会意外地得到这个错误。

如果你禁用了strictNullInputTypes 如果你使用一个文字类型，比如Fruit作为@Input() 你试图将'Orange'传递给一个输入，它被解释为一个字符串。

这将在Angular 13.1中修复。

https://github.com/angular/angular/pull/38305

我知道这有点过时了，但这里可能有更好的解决方案。

当需要字符串，但希望字符串只匹配某些值时，可以使用enum。

例如:

enum Fruit {
    Orange = "Orange",
    Apple  = "Apple",
    Banana = "Banana"
}

let myFruit: Fruit = Fruit.Banana;

现在您将知道，无论如何，myFruit将始终是字符串“Banana”(或您选择的任何其他可枚举值)。这对很多事情都很有用，无论是将类似的值分组，还是将用户友好的值映射到机器友好的值，同时强制和限制编译器允许的值。

在扩散的数组中，这个错误仍然会被抛出:

export type Fruit = "Orange" | "Apple" | "Banana"
export type FruitArray = Fruit[];

const someFruits= ["Banana"];

const workingFruits: FruitArray = ["Orange", "Apple"]; // Works

// Even orange and apple show: Type 'string' is not assignable to type Fruit
const brokenAllFruits: FruitArray = [...someFruits, "Orange", "Apple"]; 

// As const is needed in the spread array
const someConstFruits= ["Banana" as const];
const workingAllFruits: FruitArray = [...someConstFruits, "Orange", "Apple"]; // Works

我也遇到了同样的问题，我做了以下修改，问题得到了解决。

打开watchQueryOptions.d.ts文件

\apollo-client\core\watchQueryOptions.d.ts

将查询类型更改为any而不是DocumentNode，与突变相同

之前:

export interface QueryBaseOptions<TVariables = OperationVariables> {
    query: **DocumentNode**;

后:

export interface QueryBaseOptions<TVariables = OperationVariables> {
    query: **any**;