Build a Superhero Application Form - Step 18

Tell us what’s happening:

I can not seem to go past this stage.
Build a Superhero Application Form : Step 18

This is my code
"

const handlePowersChange = (e) => {
  const { value, checked } = e.target;

  setPowers(powers =>
    checked
      ? [...powers, value]
      : powers.filter(p => p !== value)
  );
}

Your code so far

<!-- file: index.html -->

/* file: styles.css */

/* file: index.jsx */
{/* User Editable Region */}

 const handlePowersChange = (e) => {
  const { value, checked } = e.target;

  setPowers(powers =>
    checked
      ? [...powers, value]
      : powers.filter(p => p !== value)
  );
}

{/* User Editable Region */}

Your browser information:

User Agent is: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/137.0.0.0 Safari/537.36

Challenge Information:

Build a Superhero Application Form - Step 18

The function needs an array argument. In the function parameter, use a ternary operator

The wording is a little strange here I think. You don’t need a new function in the setPowers() argument. You just need the ternary operation.

You already have access to the powers array because it’s a global variable, so you don’t need to pass it in.

You will be passing an array into the setPowers() function, you just need to use the ternary to see if you are adding to the array or filtering something out.