即使我使用'？ 可选运算符和 '| 不明确的'

Question

我的 linter 似乎已经停止标记传递给我的 React 组件的可能未定义的属性。 例如：

    interface BooleanTypeObject {
        prop1: true
    }
    
    interface MyComponentProps {
        disabledObject?: BooleanTypeObject | undefined;
    }
    
    export function MyComponent({
        disabledObject
    }: MyComponentProps): ReactElement {
    ...
    }

如果我尝试在我的组件中访问prop1 ，我不会收到任何 linter 错误。 但是如果disabledObject是undefined ，我会在编译代码时这样做。 我确定当我使用? 运算符，或用| undefined指定 | undefined 。

我本来希望看到(parameter) disabledObject: BooleanTeeTypeObj | undefined 此处(parameter) disabledObject: BooleanTeeTypeObj | undefined 。

我所有的其他 linting 似乎仍然适用于 typescript。 谁能想到发生了什么？

tsconfig.json

    {
        "compilerOptions": {
            "target": "ES2018",
            "module": "commonjs",
            "checkJs": false,
            "jsx": "react",
            "sourceMap": true,
            "strict": false,
            "noImplicitAny": false,
            "noUnusedLocals": false,
            "noUnusedParameters": false,
            "allowSyntheticDefaultImports": true,
            "esModuleInterop": true,
            "skipLibCheck": true,
            "forceConsistentCasingInFileNames": true
    }

Answer 1

这是因为您有strictNullChecks: false 。 当它设置为 false typescript 忽略null和undefined完全和BooleanTypeObject | undefined BooleanTypeObject | undefined等价于BooleanTypeObject 。 如果您希望 typescript 显示错误，则需要将其设置为strictNullChecks: true https://www.typescriptlang.org/tsconfig#strictNullChecks