Quantcast
Channel: Active questions tagged react-native+typescript - Stack Overflow
Viewing all articles
Browse latest Browse all 6287

type useFormik with Typescript so it get's type all the way

$
0
0

I'm a virgin when it comes to formik - but quite eager to get started with it since it looks super useful. In my attempt to play around with it I haven't figured out how to leavage TS with it.

const changePasswordSchema = Yup.object({  currentPassword: Yup.string().required(),  password: Yup.string().min(6).max(128).required(),  passwordConfirmation: Yup.string()    .equals([Yup.ref('password')], 'Adgangskoder stemmer ikke overens')    .required(),})type ChangePasswordFormValues = Yup.InferType<typeof changePasswordSchema>// sees it as// type ChangePasswordFormValues = {//   currentPassword: string;//   password: string;//   passwordConfirmation: any;// }export default () => {  const formik = useFormik<ChangePasswordFormValues>({    initialValues: {      currentPassword: '',      password: '',      passwordConfirmation: 123, // <-- was hoping this would ts error    },    validationSchema: changePasswordSchema,    onSubmit: (values: ChangePasswordFormValues) => {      // it sees it as      // values: AssertsShape<{      //   currentPassword: RequiredStringSchema<string | undefined, AnyObject>;      //   password: RequiredStringSchema<string | undefined, AnyObject>;      //   passwordConfirmation: any;      // and not like      // type ChangePasswordFormValues = {      //   currentPassword: string;      //   password: string;      //   passwordConfirmation: any;      // }      console.log(values)    },  })  return (<ScreenContainer><View style={{ height: 400 }} /><View style={{ width: '100%' }}><TextInput          {...formik.getFieldProps('')} // <-- was hoping this would auto suggest          // {...formik.getFieldProps<ChangePasswordFormValues>('')} // <-- was hoping this would auto suggest          // {...formik.getFieldProps<keyof ChangePasswordFormValues>('')} // <-- was hoping this would auto suggest        /></View></ScreenContainer>  )}

seems like I have to do

{...formik.getFieldProps('' as keyof ChangePasswordFormValues)}

but can't I just pass the type once to useFormik and not have to type every other place?


Viewing all articles
Browse latest Browse all 6287

Trending Articles



<script src="https://jsc.adskeeper.com/r/s/rssing.com.1596347.js" async> </script>