1
votes

I'm using TypeScript when writing this React Native app. Trying to create a simple action that takes a string as a param and updates state. But I get this error I don't understand.

src/containers/DamageClaimReceipt.tsx

import * as React from "react"
import { Text, View } from "react-native"
import { Question } from "../components/Question"
import GjeButton from "../components/GjeButton"
import { bindActionCreators, Dispatch } from "redux"
import { connect } from "react-redux"
import {
  SetDamageClaimReceiptNrAction
} from "../actions/processguide"

const mapDispatchToProps = (dispatch: Dispatch<any>) => bindActionCreators({
  setDamageClaimReceiptNr: SetDamageClaimReceiptNrAction,
  // 'SetDamageClaimReceiptNrAction' only refers to a type, 
  // but is being used as a value here.
}, dispatch)

class DamageClaimReceipt extends React.Component<any, any> {
  public render() {
    return (
      <View>

       <GjeButton
        title={"Set DamageClaimReceiptNr"}
        onPress={ () => this.props.setDamageClaimReceiptNr("100") }
      />

      </View>
    )
  }
}

export default connect<null, null>(
  null,
  mapDispatchToProps,
)(DamageClaimReceipt)

src/actions/processguide.ts

 10 export type SetDamageClaimReceiptNrAction =
 11   (damageClaimReceiptNr: string) => ISetDamageClaimReceiptNrAction
 12
 13 export interface ISetDamageClaimReceiptNrAction {
 14   type: actionTypes.SET_PROCESSGUIDE_RECEIPT_NR_FOR_CLAIM
 15   receiptNrForClaim: string
 16 }
1

1 Answers

0
votes

SetDamageClaimReceiptNrAction defines a method signature, when invoking bindActionCreators you pass a object literal to the method, with a setDamageClaimReceiptNr property, the property can't have the value of a function signature, it can be a function however.

const mapDispatchToProps = (dispatch: Dispatch<any>) => bindActionCreators({
  setDamageClaimReceiptNr: (damageClaimReceiptNr: string) => ({
       type: actionTypes.SET_PROCESSGUIDE_RECEIPT_NR_FOR_CLAIM
       receiptNrForClaim: "Value"
  }),
}, dispatch)