React Multiple Choice Questions (MCQs) and Answers

A component that controls all the forms in the app

A component whose state is controlled by React

A component that cannot be modified

None of the above

Using a submit button outside the form

By manually updating the DOM

Using an onSubmit event handler in the form element

None of the above

Using refs to directly access the DOM element

By storing the values in the state on every change

Using document.getElementById()

None of the above

Controlled components do not use state, while uncontrolled components do

Controlled components use refs, while uncontrolled components do not

Controlled components manage their own state, while uncontrolled components store their state in the DOM

None of the above

$<input type="text" value=\{this.state.value\} />$

$<input type="text" />$

$<textfield value=\{this.state.value\} />$

$<textinput value=\{this.state.value\} />$

onChange={(event) => this.setState({value: event.target.value})}

onInput={(event) => this.setState({value: event.target.value})}

onChange={this.updateValue}

onInputChange={(event) => this.setState({value: event})}

The value attribute is incorrect

The type attribute is incorrect

The onchange event handler should be onChange

No mistake

onSubmit should be onsubmit

The form should have an action attribute

The form is missing an onChange handler for the input

No issue

Moving state to a child component for shared access

Moving state to a parent component for shared access

Deleting state

None of the above

It enhances the performance of the application

It allows child components to modify each other's state directly

It enables multiple components to share and synchronize state changes

It simplifies the debugging process

Using refs to update parent state from the child

Using a callback function passed from parent to child

Relying on global variables

None of the above

Increased rendering time for all components

Difficulty in managing state across distant components

Increased risk of security vulnerabilities

None of the above

By using global state management libraries like Redux

By passing a state setter function from parent to child

By using React context

None of the above

Directly modify the parent's state

Use a callback function provided by the parent

Send a request to the parent via an event bus

None of the above

updateState should be bound to this in the constructor

updateState is missing parameters

Child component should not receive onChange prop

No issue

onChange handler in Child is not implemented correctly

The value prop in Child is redundant

setState should not be used in the render method

No issue

Inheritance

Composition

Both equally

Neither

Composition allows you to use multiple inheritances

Composition provides a clearer component hierarchy

Composition is easier to debug

Inheritance is more performant

By inheriting methods from parent components

By rendering props children

By using higher-order components

By using React hooks

Extending one component from another

Using state and lifecycle methods in class components

Passing components as props to other components

Using context API

Inheritance is not supported in React

Composition allows for easier code refactoring and maintenance

Composition makes components more complex

None of the above

$<Parent><Child /></Parent>$

$class Parent extends React.Component \{ /*...*/ \}$

$<Parent>\{this.props.children\}</Parent>$

$React.cloneElement(this.props.children)$

By using a prop to pass a function

By passing content as a child between component tags

By extending the component class

By using React context

A component that inherits from another component

A function that takes a component and returns a new component

A class that renders multiple components

None of the above

The should not be nested inside

The component needs to render this.props.children

There is no error in this approach

The components should be connected using inheritance

React does not support class inheritance

Inheritance can lead to a more complex and less predictable component structure

BaseComponent methods can't be overridden

There is no issue

Managing state within components

Routing between different components based on URL

Styling components

None of the above

$<Router>$

$<Route>$

$<Switch>$

$<Link>$

It switches the application's theme

It provides conditional logic for rendering components

It toggles between two routes

None of the above

Using the navigate() function

Using the component

Using the component

All of the above