我遇到了一个问题，我必须在我的存储/视图/组件文件中重新键入/重新定义重复类型，即考虑一个视图，该视图接受一些存储值并具有更改该值的函数，并且该函数向下传递到组件。
这里发生了很多类型可重用性，我继续研究如何为此构建项目，但没有发现任何有用的东西。我确实发现了$PropertyType实用程序类，这使我采用了以下方法
// @flow
import React, {Component}
import OtherComponent from "./OtherComponent"
export type MyComponentProps = {
something: string
}
export type MyComponentState = {
something2: boolean
}
export type MyComponentActions = {
check: (
something2: $PropertyType<MyComponentState, 'something2'>,
something: $PropertyType<MyComponentProps, 'something'>
) => string
}
class MyComponent extends Component<MyComponentProps, MyComponentState> {
state = { something: /* comes from somewhere else i.e store */ false }
check: $PropertyType<MyComponentActions, 'check'> = (something2, something) => something2 ? "Default" : something
render() {
return <OtherComponent foo={this.check} />
}
}
这是一个有点无用的例子，但它显示了我选择的模式，这样OtherComponent可以导入这些类型，即用于check函数并在指定其foo道具类型时使用$PropertyType。
它有效，但非常冗长，因此我想向社区询问替代建议。
我的主要目标是能够重用这些类型，而无需以干净的方式重新键入它们。
我认为这个问题没有一个普遍的答案，我不能在这里给你一个明确的答案。我已经广泛地使用 flow 工作了 1,5 年，现在也和 React 一起工作了一年。下面是使用类型的一些提示。
1. 使用类型推断
在推断类型方面，流量真的很强大。结合以下提示，您可以避免进行大量注释。心流只会发现事情是有效的。还可以使用typeof批注来获取值的类型。
2. 使用类型而不是组件接口对域进行建模
这在评论中已经提到过。使用类型对域进行建模。例如，如果您使用显示用户的组件，则对用户对象建模，而不是组件的接口。然后，您可以在使用它的组件中导入用户类型。
type User = { id: string, name: string };
type ProfilePropType = { user: User };
class Profile extends Component<ProfilePropType> {
// ...
}
3. 使用状态管理
例如，Redux可以帮助您处理此处的类型。这将为您提供域类型的结构，并减少传递的道具数量。另一个祝福是 GraphQL 和 Apollo 客户端/中继。
4. 以编程方式生成类型
我们通过后端的后加载器从 Postgres 模式生成类型，并在前端为 GraphQL 查询生成类型。目前，我们正在努力从他们的文档中为react-semantic-ui生成类型。在那之后，我们自己写的类型就不多了。可能有一些工具适合您的用例。
最后一件事：
类型很详细。有时明确一点是件好事。这个想法是，类型通过强制你明确事物来减少你花在搜索错误上的时间。通常，重新定义事物是可以的。这也将导致比使用$PropertyType更好的错误，因为 Flow 将为您提供两种不兼容的类型，而不是神秘的消息。