React - Use Default Props

JavaScript
1

Tell us what’s happening:

The code editor shows a ShoppingCart component. Define default props on this component which specify a prop items with a value of 0.

  1. The ShoppingCart component should render.
    Waiting:2. The ShoppingCart component should have a default prop of { items: 0 }.

import ShoppingCart from ‘./ShoppingCart’;

const ShoppingCart = (props) => {
return (


Shopping Cart Component


Items: {props.items}



)
};

ShoppingCart.default

Your code so far

import ShoppingCart from './ShoppingCart';

const ShoppingCart = (props) => {
  return (
    <div>
      <h1>Shopping Cart Component</h1>
      <p>Items: {props.items}</p>
    </div>
  )
};
// Change code below this line

ShoppingCart.defaultProps = {
  items: 0
};

export default ShoppingCart;

Your browser information:

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

Challenge Information:

React - Use Default Props

2

it looks like you have a naming conflict. You are importing ShoppingCart and then redefining it as a function component. Try renaming the function component to avoid the conflict

3

You are never asked to import or export, remove both.