Simple Example of a form Component in React Native
This is a simple example of a form component in React Native. The component uses state to manage the values of the title
and content
inputs, and passes the values to the onSubmit
function when the user presses the “Save Blog Post” button.
import React, { useState } from ‘react’;
import { View, Text, StyleSheet, TextInput, Button } from ‘react-native’;
const BlogPostForm = ({ onSubmit, initialValues }) => {
const [title, setTitle] = useState(initialValues.title);
const [content, setContent] = useState(initialValues.content);
return (
Enter Title: setTitle(text)} /> Enter Content: setContent(text)} /> onSubmit(title, content)} />
);
}; BlogPostForm.defaultProps = {
initialValues: {
title: ”,
content: ”
}
}; const styles = StyleSheet.create({
input: {
fontSize: 18,
borderWidth: 1,
borderColor: ‘black’,
marginBottom: 15,
padding: 5,
margin: 5
},
label: {
fontSize: 20,
marginBottom: 5,
marginLeft: 5
}
}); export default BlogPostForm;