加入收藏 | 设为首页 | 会员中心 | 我要投稿 李大同 (https://www.lidatong.com.cn/)- 科技、建站、经验、云计算、5G、大数据,站长网!
当前位置: 首页 > 百科 > 正文

reactjs – Typescript – React 0.14无状态功能组件

发布时间:2020-12-15 09:34:09 所属栏目:百科 来源:网络整理
导读:简单的例子: 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): error TS2605: JSX
简单的例子:

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): error TS2605: JSX element type ‘Element’ is not a constructor function for JSX elements.

请注意,错误与Component的使用有关(让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>
          );
    } 
}

我从typescript编译器得到这个错误:

error TS2605: JSX element type ‘Element’ is not a constructor function
for JSX elements. Property ‘render’ is missing in type ‘Element’.

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

解决方法

定义无状态组件时,它是一个简单而简单的函数.

当你实例化它(即将它传递给React.createElement)时,它将被React.StatelessComponent包装.

(编辑:李大同)

【声明】本站内容均来自网络,其相关言论仅代表作者个人观点,不代表本站立场。若无意侵犯到您的权利,请及时与联系站长删除相关内容!

    推荐文章
      热点阅读