WhyINeedToKnowThis
WhyINeedToKnowThis

Reputation: 167

typescript mapDispatchToProps got error when import component require pass actions as props

I'm new to redux and try to use it with Typescript.

I use mapDispatchProps for connect() in the component, when import this component, it requires to pass actions as props which it shouldn't. The weird thing is when I tried with other actions, it seems fine, but just something wrong with this one.

The full code is here and the error message in index.tsx, where I want to import component.

Error message

Property 'getInputUserName' is missing in type '{}' but required in type 'Readonly>'.ts(2741) App.tsx(8, 3): 'getInputUserName' is declared here.

Really happy to hear any advice. Thanks in advance!

Upvotes: 0

Views: 110

Answers (2)

manish.singh
manish.singh

Reputation: 46

You should pass the action with same name as it is declared in the Props interface.

So either try this -

export default connect(
  mapStateToProps,
  { getInputUserName: loginUserName }
)(App)

or this -

interface Props {
  inputUserName: string;
  loginUserName: typeof loginUserName;
}

Upvotes: 1

Wijitha
Wijitha

Reputation: 1389

Can you try this,

export default connect(
  mapStateToProps,
  { getInputUserName: loginUserName }
)(App);

Cheers,

Upvotes: 0

Related Questions