I still have problems with this exercise even though I checked the Hint

Tell us what’s happening:
Describe your issue in detail here.

  **Your code so far**

const Items = (props) => {
return <h1>Current Quantity of: {props.quantity}</h1>

Items.defaultProps = {
quantity: 0

class ShoppingCart extends React.Component {
constructor(props) {
render() {
  { /* Change code below this line */ }
  <Items quantity={10}/>

  return <Items />
  { /* Change code above this line */ }
  **Your browser information:**

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

Challenge: Override Default Props

Link to the challenge:

Hello @TheMatrix5

I can see you are calling Items component twice

  1. within the return statement
  2. before return statement

the challenge requires you to override the default props while calling the component in return statement.

You need to setup the props when you render the component, see the return

Thank you for your reply.

I still do not understand. I am supposed to add the code below only and I did so but the last check returns an error.

It says:
The Items component should have a prop of { quantity: 10 } passed from the ShoppingCart component.

I do not understand because I added the code which should change the 0 to 10 as follows and it comes from the Hint.

return <Items />

I am a bit lost with this exercise.


these are two different Items, one is being returned, the other is not. You need to delete the one not being returned, and change the one being returned

Thank you for your reply.
I do not understand very well what you mean.
The first line of code sets the number to 10 instead of 0.
The second one returns the value.
I got it from the Solution. But it does not work.

I solved it now.
I understand what I did wrong.

Thank you.

This topic was automatically closed 182 days after the last reply. New replies are no longer allowed.