jaredpalmer / jaredpalmer/formik
How to pass data from component to initialValues in React Native?
- Dominant language
- TypeScript
- Stars
- 34.3k
- Forks
- 2.8k
- PR merge metrics
- No merged PRs in 30d
Description
## ❓Question
Hello everyone. For React Native how can I pass location data from a Component(it's not input and handleChange(), handleBlur() don't work)? I moved initialValues separately like this: const initialValues = { title: "", image: "", location: {} };, and tried various ways to insert location data but it didn't work; when I start with title(it's input tag), then image, then location, it fails to keep location data. If I start with location then title, then image then it works. const initialValues = { title: "", image: "", location: {} };
const NewPlaceScreen = (props) => {
const dispatch = useDispatch();
const [locationCoords, setLocationCoords] = useState({});
// const [titleValue, setTitleValue] = useState("");
const initialValues = { title: "", image: "", location: {} };
const locationPickedHandler = useCallback((locationData) => {
// initialValues["location"] = locationData;
setLocationCoords(locationData);
});
useEffect(() => {
initialValues.location = locationCoords;
}, [initialValues.title, initialValues.image, locationCoords]);
return (
{
console.log("NEW PLACE ", values),
dispatch(
placeActions.addPlace(values.title, values.image, values.location)
);
props.navigation.goBack();
}}
>
{(formikProps) => (
Title
{formikProps.touched.title && formikProps.errors.title}
)}
);
};
Contributor guide
Research direction
Start at the NewPlaceScreen entry point and trace how Formik receives initialValues, how locationPickedHandler updates locationCoords, and how LocationSelector invokes the callback. Reproduce the submission order involving title, image, and location, then confirm that the submitted values retain the selected location.
Written by the indexing model from the issue text.
Assessment
- Tech stack
- javascript, react-native
- Domain
- mobile
- Issue type
- Bug
- Difficulty
- 3/5
- Estimated time
- 1-2 days
- Activity status
- Stale
- Clarity
- Mostly clear
- Newbie friendliness
- 25/100