问题类似于如何从Typescript 1.6中的单独文件正确导入React JSX。
当所有代码都在一个文件中时,它可以正常工作。但是,当我将组件放入另一个文件并尝试导入时,打字稿编译器给出了错误。
代码看起来不错。
我得到的错误是
JSX元素类型“ Hello”没有任何构造或调用签名。
app.tsx
/// <reference path="typings/tsd.d.ts" />
import React = require('react');
import ReactDOM = require('react-dom');
import $ = require('jquery');
import Hello = require('./components/Hello');
$(()=>{
ReactDOM.render(<Hello name="Tom" />,document.body);
});
组件/Hello.tsx
/// <reference path="../typings/tsd.d.ts" />
import React = require('react');
export default class Hello extends React.Component<any,any>{
render(){
return <div className="hello">Hello {this.props.name} !</div>;
}
}
tsconfig.json
{
"compilerOptions": {
"module": "commonjs",
"jsx": "react"
}
}
如果你写这些行
export default class Hello ...
/* and */
import Hello = require('./components/Hello');
然后,您需要编写以下代码来使用它:
<Hello.Hello name="Tom" />
您可以改为编写此代码,以更改模块以将类导出为其顶级对象:
class Hello ...
export = Hello
或者您可以Hello
通过解构从模块导入导出:
import { Hello } from './components/Hello';
或者您可以从模块导入默认导出:
import Hello from './components/Hello';
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句