React-Final-Form hidden field values

Question

I am transitioning from Redux-forms to react-final-forms, and I'm having trouble figuring out how to handle hidden form values. In redux-forms I could do something like this.props.change("createdBy", this.props.user.profile.username) to set a hidden value, but that option doesn't appear to be an option in react-final-forms (or I am missing it).

I have thought that I could possibly use initialValues which works on new forms, but I run into trouble if I need to add additional values in a initial form. For example,

<Form
  onSubmit={ this.onSubmit }
  initialValues={
    item
      ? item
      : { createdBy: "Rachel", createdOn: new Date(), active: true }
  }
  render={({ handleSubmit, form, submitting, pristine, values }) => (
    <form onSubmit={handleSubmit}>
...

where item might look like:

{
   code: "WTTC",
   description: "Welcome to the Club",
   active: true,
   createdBy: "Rachel",
   createdOn:"02/23/2021",
   modifiedBy: null,
   modifiedOn: null,
}

So if I set the initialValue of the form with the above item, I would like to also set modifiedBy and modifiedOn values which I use to do with this.props.change("createdBy", this.props.user.profile.username).

Any suggestions?

Answer 1

I am not familiar with this library at all, but from JS perspective you might achieve it by manipulating the initial value regarding the item object

initialValues={
          item
            ? {...item,createdBy: this.props.user.profile.username, createdOn: new Date()}
            : { createdBy: "Rachel", createdOn: new Date(), active: true }
        }