ReactJS – TypeScript – React 0.14 Stateless Function Components

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

var Aquarium = ({species}) => (
 
 {getFish(species) }
 
);
let x = ;

let GreeterComponent = (props: (name: string)){ 
 return 
Hi {props.name}!
 
}

class WrappingComponent extends React.Component{
 render(){
 let names = ['tom','john','simon'];
 return (< br /> 

 {names.map((name)=> )}
 

 ); 
} 
}

Simple example:

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

var Aquarium = ({species}) => (
 
 {getFish(species)}
 
);
let x = ;

Result:

(10,9): error TS2605: JSX element type’Element’ is not a constructor function for JSX elements.

Please note that the error is related to the use of Component (let x statement). It seems that React’s definition file may not allow it to be a valid JSX? I am using the latest React 0.14 definition file from tsd, what am I doing wrong?

Suppose I have defined the following stateless functional components (React v0.14)

let GreeterComponent = (props: (name: string)){ 
 return 
Hi {props.name}!
 
}

In another component, I use it like this:

class WrappingComponent extends React.Component{
 render(){
 let names = ['tom','john','simon'];
 return (< br /> 

 {names.map((name)=> )}
 

 ); 
} 
}

I got this error from the typescript compiler:

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

How can I solve it? What is the correctness of using stateless functional components in typescript? I am using the latest react.d.ts from tsd

When defining stateless components, it is a simple and simple function.

< /p>

When you instantiate it (i.e. pass it to React.createElement), it will be wrapped by React.StatelessComponent.