TypeScript、redux-form 和连接

Question

首先，我是 TS、React 和 Redux 的新手，如果这是一个明显的问题，我很抱歉。

我正在尝试修改 this example to get a form to load some information. It's using redux-form。

我想弄清楚如何在导出组件时同时调用 connect 和 redux-form。现在它看起来像这样：

class UserForm extends React.Component<IUserProps, void> { .. }

export default ReduxForm.reduxForm({
  form: 'user',
  fields: [
    'userName',
    'password',
    'firstName',
    'lastName',
    'email'
  ],
  validate: UserForm.validate,
})(UserForm);

我看过的例子 without TS 是这样的：

class MyForm extends Component {}
MyForm = reduxForm(config)(MyForm)
MyForm = connect(mapStateToProps, mapDispatchToProps)(MyForm)
export default MyForm

但是如果我尝试在 TS 中做同样的事情，我会收到 TS2300 错误：标识符重复。

我也尝试过使用 @connect 装饰器，但我无法让它工作（或在网上找到任何工作示例）。

Answer 1

你能把它们串起来吗？

class UserForm extends React.Component<IUserProps, void> { .. }

export default connect(mapStateToProps,mapDispatchToProps) 
    (ReduxForm.reduxForm({
  form: 'user',
  fields: [
    'userName',
    'password',
    'firstName',
    'lastName',
    'email'
  ],
  validate: UserForm.validate,
})(UserForm));

Answer 2

无法修复，但可以通过强制转换为 any

来消除问题

connect(mapStateToProps, mapDispatchToProps)(MyForm as any)

TypeScript、redux-form 和连接

TypeScript, redux-form and connect

typescript

reactjs

redux-form

react-redux