Managing form submissions in React usually involves a few steps. Here's a simple outline for handling form submissions in a React component:

1. Make a Form Component: Create a React component for your form. This component will have HTML form elements like <input>, <select>, <textarea>, etc.

2. Manage State: Use React state (like useState hook or class component state) to handle form data. Connect each form input to a state variable.

3. Handle Input Changes: Create event handlers (onChange event) for each form input to update the matching state variable when the user types.

4. Handle Form Submission: Make an event handler (onSubmit event) for the form. This handler is called when the user submits the form.

5. Stop Default Action: In the form submission handler, stop the default form submission action with event.preventDefault(). This keeps the page from refreshing.

6. Get Form Data: Access the form data from the state variables and do any needed validation.

7. Submit Data: Send the form data to the server or do any other required action, like making an API call.

8. Reset Form: If you want, reset the form fields after a successful submission.

Here's a basic example using functional components and hooks:

import React, { useState } from 'react';

const MyForm = () => {
  const [formData, setFormData] = useState({
    username: '',
    email: '',
    password: ''
  });

  const handleInputChange = (event) => {
    const { name, value } = event.target;
    setFormData({
      ...formData,
      [name]: value
    });
  };

  const handleSubmit = (event) => {
    event.preventDefault();
    // Access form data from formData state
    console.log(formData);
    // Perform form submission action (e.g., send data to server)
    // Reset form fields if needed
    setFormData({
      username: '',
      email: '',
      password: ''
    });
  };

  return (
    <form onSubmit={handleSubmit}>
      <input
        type="text"
        name="username"
        value={formData.username}
        onChange={handleInputChange}
        placeholder="Username"
      />
      <input
        type="email"
        name="email"
        value={formData.email}
        onChange={handleInputChange}
        placeholder="Email"
      />
      <input
        type="password"
        name="password"
        value={formData.password}
        onChange={handleInputChange}
        placeholder="Password"
      />
      <button type="submit">Submit</button>
    </form>
  );
};

export default MyForm;

This example displays a basic form with spaces for username, email, and password. The form data uses the useState hook, and the handleSubmit function handles submitting the form.

Display ReactJs form data in webpage:

To show data from a React form on the webpage, you can modify the previous example. Once the form data is submitted, you can display the submitted information below the form. Here's an extended example:

import React, { useState } from 'react';

const MyForm = () => {
  const [formData, setFormData] = useState({
    username: '',
    email: '',
    password: ''
  });
  const [submittedData, setSubmittedData] = useState(null);

  const handleInputChange = (event) => {
    const { name, value } = event.target;
    setFormData({
      ...formData,
      [name]: value
    });
  };

  const handleSubmit = (event) => {
    event.preventDefault();
    // Access form data from formData state
    console.log(formData);
    // Set submittedData state to display on the web page
    setSubmittedData(formData);
    // Perform form submission action (e.g., send data to server)
    // Reset form fields if needed
    setFormData({
      username: '',
      email: '',
      password: ''
    });
  };

  return (
    <div>
      <form onSubmit={handleSubmit}>
        <input
          type="text"
          name="username"
          value={formData.username}
          onChange={handleInputChange}
          placeholder="Username"
        />
        <input
          type="email"
          name="email"
          value={formData.email}
          onChange={handleInputChange}
          placeholder="Email"
        />
        <input
          type="password"
          name="password"
          value={formData.password}
          onChange={handleInputChange}
          placeholder="Password"
        />
        <button type="submit">Submit</button>
      </form>

      {submittedData && (
        <div>
          <h2>Submitted Data:</h2>
          <p>Username: {submittedData.username}</p>
          <p>Email: {submittedData.email}</p>
          <p>Password: {submittedData.password}</p>
        </div>
      )}
    </div>
  );
};

export default MyForm;

In this new example, we add a state variable submittedData to save the submitted form information. When the form is sent, the setSubmittedData function updates the state, and the submitted data shows up under the form. We use {submittedData && ...} to check if the form is submitted before showing the data.

This way, the submitted data appears on the web page after the form is sent.