Question

我在根App.tsx中用book = {MY_MOCK}调用BookTracker组件，

type BookParamsTypes = {
  title: string;
  pubDate: number;
  //... rest
};

import { BookParamsTypes } from "./types/BookParamsTypes";

type BookTrackerProps = {
  book: BookParamsTypes[];
};

const BookTracker = ({ book }: BookTrackerProps) => (
//...
        <BookDetailed book={book}/>
//...
);

对于上面的BookDetailed我有一条错误消息 “ JSX元素类型'{book：BookParamsTypes [];（遗漏）：任何;}'不是JSX元素的构造函数。类型'{book：BookParamsTypes []; （缺少）：任何； }”缺少类型“元素”中的以下属性：类型，道具，键-ts（2605）” 怎么会这样？没有任何线索

然后我无法在BookDetailed内部正确映射

{book.map((item, i: number) => (
  // ..
      <BookTitle>{item.title}</BookTitle>
  // ... rest
  ))}

Linter根本不了解book.map，还说项目隐含任何类型 ...

供其他参考，这是我的tsconfig：

{
  "compilerOptions": {
    "target": "es5",
    "lib": [
      "dom",
      "dom.iterable",
      "esnext"
    ],
    "allowJs": true,
    "skipLibCheck": true,
    "esModuleInterop": true,
    "allowSyntheticDefaultImports": true,
    "strict": true,
    "forceConsistentCasingInFileNames": true,
    "module": "esnext",
    "moduleResolution": "node",
    "resolveJsonModule": true,
    "noEmit": true,
    "jsx": "preserve",
    "noUnusedLocals": true,
    "noUnusedParameters": true,
    "removeComments": false,
    "preserveConstEnums": true,
    "types": [],
    "isolatedModules": true
  },
  "include": [
    "src/*"
  ],
  "exclude": [
    "node_modules",
    "**/*.spec.ts",
    "**/*.spec.ts",
    "src/sw-*.js",
    "src/idb.js"
  ]
}

和package.json

"dependencies": {
    "@types/jest": "24.0.11",
    "@types/node": "11.13.6",
    "@types/react": "16.8.14",
    "@types/react-dom": "16.8.4",
    "@types/styled-components": "^4.1.14",
    "react": "^16.8.6",
    "react-dom": "^16.8.6",
    "react-scripts": "2.1.8",
    "styled-components": "^4.2.0",
    "typescript": "3.4.4"
  }
"devDependencies": {
    "babel-plugin-styled-components": "^1.10.0",
    "stylelint": "^10.0.1",
    "tslint": "^5.16.0",
    "tslint-config-airbnb": "^5.11.1",
    "tslint-config-prettier": "^1.18.0",
    "tslint-react": "^4.0.0"
  }

也许我有某种tslint / config冲突？可以请人帮我弄清楚吗？

Answer 1

确保正确定义了BookDetailed组件。

如何使用TS修复create-react-app中的问题

1 个答案: