Question

我已经开始在我的React应用程序中使用TypeScript，但是我发现自己在重复自己，尤其是我的mapDispatchToProps函数。有没有更好的方法来声明类型？

我有种感觉，我也许可以访问异步功能上使用的this接口state内的函数类型，但是，我对TS知之甚少，不能在任何地方找到对此的具体答案。

index.tsx

import { globalDispatchKeyData } from '../actions.tsx'
import { doSomething } from './services'

class Index extends Component {
  // I declare it here
  globalDispatchKeyData: (key: string, data: {}) => void

  constructor(props: any) {
    this.globalDispatchKeyData = this.props.globalDispatchKeyData.bind(this)
    this.doSomething = doSomething.bind(this)


    ...
  ...
}

const mapDispatchToProps = { globalDispatchKeyData }

services.tsx

interface IndexState {
  // I also declare it here
  globalDispatchKeyData: (key: string, data: {}) => void
}

export async function doSomething(this: IndexState) {
   globalDispatchKeyData('TYPE', {})
}

这是当前为调度函数声明类型的唯一方法还是我遗漏了什么？

谢谢您的帮助！

Answer 1

您可以为任何其他类型创建类型别名，以避免重复您自己。

type DispatchKeyDataFn = (key: string, data: {}) => void

// Usage
globalDispatchKeyData: DispatchKeyDataFn

类型别名非常灵活，可以用来创建并集，交集以及此处记录的许多其他内容

https://www.typescriptlang.org/docs/handbook/advanced-types.html（朝下半部分）

如何保持TypeScript类型为DRY

1 个答案: