Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

How to create & use Mui Tabs Component as a custom radio field? #238

Open
CharlestonREM opened this issue Feb 11, 2021 · 0 comments
Open
Labels
good first issue Good for newcomers question Further information is requested

Comments

@CharlestonREM
Copy link

CharlestonREM commented Feb 11, 2021

Problem / Question:

How do I create a custom component that employs Material UI Tabs behavior while using the Formik Field component and radio group behavior?
I'm running into issues in the sandbox. I want to use the fieldToRadioGroup function that is provided but it's unclear how. I am trying an approach based on this prior issue and solution.

Intended Behavior

  • to use mui tabs component as a Formik radio field
  • employ formik-material-ui's fieldToRadioGroup function to create custom radio component
  • to set the field value of the Field as soon as the Tabs component ComponentDidMount
  • thinking i should employ React hook useEffect for onload setting field value to active tab value
  • when tab value changes, update the field value

image

Code Sandbox

Here is the code sandbox attempt based on formik material ui codesandbox:
https://codesandbox.io/s/keen-cloud-vhpvd?file=/src/index.tsx

Background Info

  • Mui Tabs in action here
  • Mui Tabs api here
@cliedeman cliedeman added good first issue Good for newcomers question Further information is requested labels Aug 20, 2021
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Labels
good first issue Good for newcomers question Further information is requested
Projects
None yet
Development

No branches or pull requests

2 participants