'How to parse '<NavLink className={({ isActive }) => isActive ? "red" : "blue"} />'?

I think I understand why the first instance of isActive that's passed as an argument to the arrow function is encapsulated in curly brackets, i.e. { isActive }, while the second isActive is not encapsulated in curly brackets, but would like to be sure I understand correctly.

Is the first "isActive" that's encapsulated in curly brackets i.e., ({ isActive }) an example of Object Destructuring ? (If not, doesn't an arrow function in JS expect to receive the name of a variable, but doesn't { isActive } evaluate to true or false?)

Am I right that this is an example of Object Destructuring?



Sources

This article follows the attribution requirements of Stack Overflow and is licensed under CC BY-SA 3.0.

Source: Stack Overflow

Solution Source