javascript - How to make Formik return a boolean? - Stack Overflow

admin管理员组

文章数量:1287932

I'm trying to get a value back from Formik. It works with a Textfield, but I don't get the value of my switcher back (which is a boolean).

I have my file and switcher setup like this:

 <div className="side2">
          <Field
            type="email"
            label={currentEmail}
            name="email"
            placeholder={t('register.email')}
            style={{ width: '55%' }}
            className="fontLogin"
            ponent={FormikInput}
          />
        </div>
      </div>
      <div className="main">
        <div className="side">
          <p>Is admin ?</p>
        </div>
        <div className="side2">
          <Switch
            name="admin"
            id="admin"
            checked={(open === 'true')}
            onChange={() => handleChange(!(open)}
            color="primary"
            inputProps={{ 'aria-label': 'primary checkbox' }}
          />
        </div>
      </div>

And in my other file I use formik like this:

<Formik
              ref={form}
              initialValues={{ email: '', admin: '' }}
              onSubmit={(values) => {
                handleSubmit(values);
                handleClose();
              }}
              render={(props) => (
                <FormRender
                  t={t}
                  currentEmail={currentEmail}
                  currentAdmin={currentAdmin}
                  currentVerified={currentVerified}
                  activeButton
                  {...props}
                />
              )}
            />

I tried to set the value of my switcher to a string with the .toString() method, but it doesn't work.

How is it possible to get a switcher value back? What am I misunderstanding here?

Best,

I'm trying to get a value back from Formik. It works with a Textfield, but I don't get the value of my switcher back (which is a boolean).

I have my file and switcher setup like this:

 <div className="side2">
          <Field
            type="email"
            label={currentEmail}
            name="email"
            placeholder={t('register.email')}
            style={{ width: '55%' }}
            className="fontLogin"
            ponent={FormikInput}
          />
        </div>
      </div>
      <div className="main">
        <div className="side">
          <p>Is admin ?</p>
        </div>
        <div className="side2">
          <Switch
            name="admin"
            id="admin"
            checked={(open === 'true')}
            onChange={() => handleChange(!(open)}
            color="primary"
            inputProps={{ 'aria-label': 'primary checkbox' }}
          />
        </div>
      </div>

And in my other file I use formik like this:

<Formik
              ref={form}
              initialValues={{ email: '', admin: '' }}
              onSubmit={(values) => {
                handleSubmit(values);
                handleClose();
              }}
              render={(props) => (
                <FormRender
                  t={t}
                  currentEmail={currentEmail}
                  currentAdmin={currentAdmin}
                  currentVerified={currentVerified}
                  activeButton
                  {...props}
                />
              )}
            />

I tried to set the value of my switcher to a string with the .toString() method, but it doesn't work.

How is it possible to get a switcher value back? What am I misunderstanding here?

Best,

• javascript
• reactjs
• formik

Share Improve this question Follow edited Dec 3, 2019 at 17:33 Jonathan Irvin 1,0721010 silver badges1919 bronze badges asked Dec 3, 2019 at 17:18 KanKan 53977 silver badges2121 bronze badges

Add a ment  | 

1 Answer 1

Sorted by: Reset to default 10

Set the initial value to false/true, then use the props.values.admin within the Switch ponent, and use the setFieldValue Formik function to update the value.

<Formik
  initialValues={{ email: '', admin: false }}
  ...
/>

<Switch
  ...
  checked={props.values.admin}
  onChange={() => props.setFieldValue("admin", !props.values.admin)}
  ...
/>

本文标签： javascriptHow to make Formik return a booleanStack Overflow