Events and Conditional Rendering Quiz

Question 1

What is wrong with this button?

Accepted Answer

handleClick is called during render, and its return value is used as the handler

Answer

Nothing, this is correct

Answer

onClick must be lowercase

Answer

The handler needs to be async

Question 2

How do you pass an argument to an event handler?

Accepted Answer

onClick={() => handleDelete(id)}

Answer

onClick={handleDelete(id)}

Answer

onClick={handleDelete, id}

Answer

onClick="handleDelete(id)"

Question 3

How do you stop a form from reloading the page on submit?

Accepted Answer

Call event.preventDefault() in the onSubmit handler

Answer

Return false from the handler

Answer

Use onClick on the submit button instead

Answer

Set the form's action to empty

Question 4

What appears on screen when count is 0?

Accepted Answer

The number 0

Answer

Nothing

Answer

The word false

Answer

The paragraph renders anyway

Question 5

Which approach reads best for loading and error states?

Accepted Answer

Early returns at the top of the component

Answer

Deeply nested ternaries in the returned JSX

Answer

A switch statement inside JSX braces

Answer

Rendering everything and hiding it with CSS

Question 6

What happens to the input's typed value when isEditing flips?

Accepted Answer

It is kept, because the element type at that position is still input

Answer

It is cleared, because the condition changed

Answer

React throws a warning

Answer

The component unmounts entirely

Question 7

What is the simplest way to reset a form component's state when the selected record changes?

Accepted Answer

Give the component a key that changes with the record id

Answer

Clear each state value in an effect

Answer

Call forceUpdate

Answer

Unmount the parent