title: In Redux Form, how can I set the initial value of the checked property of a checkbox?
body: <p>In our Redux Form 5.3 (not 6.x) app, I want to render an <code>&lt;input type="checkbox" /&gt;</code> like so:</p>
  
  <pre><code>// In some cases, fieldHelper.checked is initially undefined. Then, when the
  // user clicks one of the checkboxes, fieldHelper.checked is
  // explicitly set to true or false. This change from one of the component's
  // props being undefined to having a value causes a React warning; see
  // http://stackoverflow.com/a/38015169/473792 and
  // https://facebook.github.io/react/docs/forms.html#controlled-components
  // So to prevent that warning, we do a quick null check on
  // fieldHelper.checked and replace it with false explicitly if it is
  // undefined before rendering the checkbox.
  const fieldHelper = this.props.field['checkbox'];
  const checked = fieldHelper.checked || false;
  
  const modifiedFieldHelper = Object.assign({}, fieldHelper);
  delete modifiedFieldHelper.checked;
  
  return (
    &lt;input
      checked={checked}
      {...modifiedFieldHelper}
    /&gt;
  );
  </code></pre>
  
  <p>}</p>
  
  <p>As noted in the comment, in my testing environment, <code>this.props.field['checkbox'].checked</code> is <code>undefined</code> immediately after mounting the <code>&lt;input&gt;</code>. As a result, when my tests modify the value of <code>this.props.field['checkbox'].checked</code>, I get the following warning:</p>
  
  <blockquote>
    <p>Warning: ApplicantForm is changing an uncontrolled input of type checkbox to be controlled. Input elements should not switch from uncontrolled to controlled (or vice versa). Decide between using a controlled or uncontrolled input element for the lifetime of the component.</p>
  </blockquote>
  
  <p>... Unless I explicitly set the <a href="https://facebook.github.io/react/docs/dom-elements.html#checked" rel="nofollow noreferrer"><code>checked</code> prop</a> on the <code>&lt;input&gt;</code> to <code>false</code> instead of <code>undefined</code>, as demonstrated in the code snippet I posted above.</p>
  
  <p>Instead of using this null check, I would like to set the initial value of <code>this.props.fields['checkbox'].checked</code> before my tests run. <a href="http://redux-form.com/5.3.1/#/examples/initializing-from-state" rel="nofollow noreferrer">I know I can set the initial value of fields in Redux Form.</a> Is there a way to set the initial value of an auxiliary property like the <code>checked</code> property that Redux Form also controls? </p>