Question

换句话说，我可以使用React + TypeScript或React + Flow做这样的事情吗？

function Foo(rect:Rect) {
   return <div><span>{rect.x}</span><span>{rect.y}</span></div>;
}

而不是：

function Foo({x,y}:{x:number,y:number}) {
   return <div><span>{x}</span><span>{y}</span></div>;
}

Answer 1

将它们创建为函数的属性。见https://facebook.github.io/react/docs/reusable-components.html#stateless-functions

function YourComponent(props) {}

YourComponent.propTypes = {
  someProp: React.PropTypes.object.isRequired
};

export default YourComponent;

在Javascript中，函数只是对象。

Answer 2

以下是我要找的答案：

// TypeScript
class Foo extends React.Component<FooProps, FooState> {}

// Flow
class Foo extends React.Component {
  state: FooState;
  props: FooProps;
}

我可以为功能UI组件声明道具类型吗？

2 个答案: