Как передать значение из tcomb-form-native в редуктор? Реакт + редукс

Question

В моем проекте я использую tcomb-form-native библиотека для проверки формы. Redux работает нормально, но я не могу передать значение входов редуктору. Я должен сделать это, потому что я хочу создать массив с данными из полей.

Как передать значения моих входов в редуктор? Или, возможно, это невозможно с этой библиотекой, и я должен использовать другую?

Form.js

const mapDispatchToProps = dispatch => {
  return {
      closeExpenseDialog: (value) => dispatch({type: 'CLOSE_EXPENSE_DIALOG'}),
  };
};

const mapStateToProps = state => {
  return {
      value: state.closeExpenseDialog.value,
  };
};


const Form = t.form.Form;

const Expense = t.struct({
  expense: t.String,
  cost: t.Number
});

const options = {
  fields: {
    expense: {
      error: 'This field is required'
    },
    cost: {
      error: 'This field is required'
    }
  }
};

handleClick = () => {
    const value = this._form.getValue();
    if (value) {
      console.log(value);
      this.props.closeExpenseDialog(value);
    } else {
      console.log('validation failed');
    }
  }

  <Form 
   type={Expense}
   ref={c => this.props._form = c}
   options={options} 
   value={this.props.value}
  />
  <ActionButton
   onPress={this.props.closeExpenseDialog}
   title={title}
  />

Reducer.js

const initialState = {
    value: {}
};
const mainReducer = (state = initialState, action) => {
 switch (action.type) { 
   case 'CLOSE_EXPENSE_DIALOG':
     console.log('it works')
     console.log(state.value) //undefined
   default:
     return state;
   }
  };

Answer 1

Мне нужно было добавить onChange() атрибут и использовать его для передачи объекта value к редуктору.

Form.js

const Expense = t.struct({
  expense: t.String,
  cost: t.Number
});

const options = {
   fields: {
    expense: {
      error: 'This field is required'
    },
    cost: {
      error: 'This field is required'
   }
 }
};

handleClick = () => {
   const value = this._form.getValue();
    if (value) {
  this.props.submitExpenseDialog();
 } 
}

<Form 
 type={Expense}
 ref={c => this._form = c}
 options={options} 
 value={this.props.value}
 onChange={this.props.changeExpenseInputs}
/>
<ActionButton
 onPress={this.handleClick}
 title={title}
/>

Reducer.js

const initialState = {
    value: {}
};
const mainReducer = (state = initialState, action) => {
 switch (action.type) { 
   case 'SUBMIT_EXPENSE_DIALOG':
     console.log(state.value)
   default:
     return state;
 }
};