键入元素错误

时间:2017-10-11 10:04:00

标签: javascript reactjs typescript compiler-errors react-redux

我正在使用react-redux和typescript,所以我有.tsx文件。我的简单代码看起来非常简单明了但是typescript编译器抛出了Provider元素的类型错误,所以我不明白我做错了什么。

这是我的简单代码

import * as React from 'react';
import * as ReactDOM from 'react-dom';
import { Provider } from 'react-redux';
import { Route, Router } from 'react-router';

...

ReactDOM.render(
    <Provider store={store}>
      <Router history={history}>
        <Route path='/' component={MyTopComponent} breadcrumbIgnore>
          <Route
            path='home'
            component={MyComponent}
          >
          </Route>
        </Route>
      </Router>
    </Provider>,
  document.getElementById('app'),
);

这是错误:

JSX element type 'Provider' is not a constructor function for JSX elements.
  Types of property 'render' are incompatible.
    Type '() => string | number | false | Element | Element[]' is not assignable to type '{ (): string | number | false | Element | Element[]; (): string | number | false | Element | Elem...'.
      Type 'string | number | false | Element | Element[]' is not assignable to type 'false | Element'.
        Type 'string' is not assignable to type 'false | Element'.

在支持TS的Sublime编辑器中,我看到了对此错误的描述:

Property "render" are missing in type "Provider"

感谢您的帮助!

P.S。这是包版本

   "devDependencies": {
    "@types/react": "16.0.7",
    "@types/react-dom": "15.5.5",
    "@types/react-i18next": "4.6.0",
    "@types/react-redux": "5.0.9",
    "@types/react-test-renderer": "15.5.4",
    "awesome-typescript-loader": "3.2.3",
    ...
    "tslint": "5.7.0",
    "typescript": "2.5.3",
    ...
  },
  "dependencies": {
    ... ,
    "i18next": "9.0.0",
    "react": "15.6.1",
    "react-dom": "15.6.1",
    "react-dom-factories": "1.0.2",
    "react-i18next": "6.0.0",
    "react-redux": "5.0.6",
    "react-router": "3.0.2",

    "redux": "3.7.2",
    ...
  },

1 个答案:

答案 0 :(得分:0)

我找到了解决此问题的解决方案。

正如JulienD和pamelus提到检查依赖关系版本我寻找了redux / react / dom版本

因此,当我更新这些包时,typescript编译器开始正常工作

"@types/react": 16.0.7 -"16.0.10",
"@types/react-dom": 15.5.5 -> "16.0.1",
"@types/react-redux": 5.0.9 -> "5.0.10",

希望它有所帮助。最好的问候。