Incompatible with redux

[dlong500]

I'd like to use this component, but the way it handles the input values is incompatible with redux (and basically any state-management).

Trying to tie the input fields to some type of controlled state management results in the React warning:

CardReactFormContainer contains an input of type text with both value and defaultValue props. Input elements must be either controlled or uncontrolled (specify either the value prop, or the defaultValue prop, but not both). Decide between using a controlled or uncontrolled input element and remove one of these props.

The inputs don't work correctly either, as the code that handles input validation and the "controlled" nature of the input once it is tied to some state management interfere with each other.

Ideally it would be nice to have this project move to using redux behind the scenes for state management, but at the very least it would be great if it could be made to not interfere with those of us using redux.

[davincho]

@dlong500 I had the same problem and for now I am using https://github.com/amarofashion/react-credit-cards which is easy to integrate with Redux.

[jangsi]

The component manages it's own state which you can access through a ref. The docs don't specify this however:

<CardReactFormContainer container="card-wrapper" ref={(ref) => this.ccForm = ref } >

From there you can access for example: this.ccForm.inputsValues.cvc or whatever you passed in as the name for that input. Hope this helps.