How does React handle forms and form inputs?(2 Points)React provides its own <form> and <input> components for handling formsReact doesn't support forms or form inputsReact relies on native HTML form elements for handling formsReact uses controlled components where form data is managed by React state

React handles forms and form inputs using controlled components. Here's a step-by-step explanation:

1. In React, mutable state is typically kept in the state property of components and updated with setState().

2. A form in a React component is implemented with a special kind of component called a "controlled component". A controlled component makes the React state be the "single source of truth". This means that the component that renders a form also controls what happens in that form on subsequent user input.

3. For example, if we want to make the previous example log the name when it is submitted, we can write the form as a controlled component:

class NameForm extends React.Component {
  constructor(props) {
    super(props);
    this.state = {value: ''};

    this.handleChange = this.handleChange.bind(this);
    this.handleSubmit = this.handleSubmit.bind(this);
  }

  handleChange(event) {
    this.setState({value: event.target.value});
  }

  handleSubmit(event) {
    alert('A name was submitted: ' + this.state.value);
    event.preventDefault();
  }

  render() {
    return (
      <form onSubmit={this.handleSubmit}>
        <label>
          Name:
          <input type="text" value={this.state.value} onChange={this.handleChange} />
        </label>
        <input type="submit" value="Submit" />
      </form>
    );
  }
}

In this way, React uses controlled components where form data is managed by React state. It does not provide its own <form> and <input> components for handling forms, nor does it rely on native HTML form elements for handling forms.

React handles forms and form inputs using controlled components. Here's a step-by-step explanation:

1. In React, mutable state is typically kept in the state property of components and updated with setState().

2. A form in a React component is rendered with a value attribute on its form field components. This makes the React state the "single source of truth" for the form input and value.

3. The value attribute on each form element can be hooked to a state property, making the React state the master of that value.

4. Therefore, the form field's value is updated via React's one-way data flow. An event handler updates the state with the user's input.

5. This is called a Controlled Component. A form element becomes "controlled" if you set its value via a prop.

So, React uses controlled components where form data is managed by React state. It does not provide its own <form> and <input> components, nor does it rely on native HTML form elements. Instead, it uses the native form elements but controls them by setting their value and handling their change events in a way that allows React to keep the form data in the component's state.