4

简单的例子：

import * as React from 'react'
declare function getFish(x: any): any;
declare var Tank: any;

var Aquarium = ({species}) => (
  <Tank>
      {getFish(species)}
  </Tank>
);
let x = <Aquarium species="rainbowfish"/>;

结果：

(10,9)：错误 TS2605：JSX 元素类型“元素”不是 JSX 元素的构造函数。

请注意，错误与组件的使用有关（let x 声明）。似乎 React 的定义文件不允许这是一个有效的 JSX？我正在使用来自 tsd 的最新 React 0.14 定义文件，我做错了什么？

假设我已经定义了以下无状态功能组件（React v0.14）

let GreeterComponent = (props: {name: string}){
    return <div>Hi {props.name}!</div> 
}

在不同的组件中，我这样使用它：

class WrappingComponent extends React.Component{
    render(){
        let names = ['tom', 'john', 'simon'];
        return (
           <div className="names">
               {names.map((name)=> <GreeterComponent name={name} />)}
           </div>
          );
    } 
}

我从打字稿编译器收到此错误：

错误 TS2605：JSX 元素类型“元素”不是 JSX 元素的构造函数。“元素”类型中缺少属性“渲染”。

我该如何解决？在打字稿中使用无状态功能组件的正确方法是什么？我正在使用来自 tsd的最新react.d.ts

4

3 回答 3

0

错误 TS2605：JSX 元素类型“元素”不是 JSX 元素的构造函数。“元素”类型中缺少属性“渲染”。

这在 TypeScript latest 中可以正常工作npm install typescript@latest。

于 2016-01-19T23:23:05.060 回答
0

当你定义一个无状态组件时，它是一个简单明了的函数。

当您实例化它（即传递给React.createElement）时，它会被React.StatelessComponent.

于 2016-01-12T19:43:20.717 回答
0

我必须使用@next安装打字稿：

npm install typescript@next --save-dev


在这个答案的那一刻，@next版本是1.9.0-dev.20160217.

一开始我虽然问题出在react.d.tsor react-dom.d.ts... 但事实并非如此。这些的最新版本已经安装在这里。但真正的问题是我安装了最新版本的打字稿版本 1.7.5。


关于这一点的一些注意事项：根据博客文章Using typescript@next nightly package? 不要依赖 –save-dev 来保持最新！，您不能依赖在使用和安装后将npm依赖项更新typescript到更大的版本号。@next--save-dev

正如他们解释的那样，npm update似乎不会从一个测试版更新到下一个：

例如，依赖字符串"^1.6.0-dev.20150818"（在 内package.json）将包更新为1.6.0-dev.20150825，但1.7.0-dev.20150901在运行时不会更新npm update

他们建议将npm --save-dev保存在您内部package.json的依赖项字符串更改"next"为始终使用最新的最新版本：

{
  ...
  "devDependencies": {
    ...
    "typescript": "next",
    ...
  }
}

我个人没有尝试过，因为我喜欢完全控制我正在使用的版本。npm update反正我很少跑。

于 2016-02-18T00:19:43.913 回答