CODEWITHSUNDEEP
imagereactjssrcprop
Alex
Alex

Reputation: 467

React Set Image Props

Hello guys im new to REACT im trying to pass my image props to {logo} has anybody a clue how i can set it up ? 123 is displayed but i still miss the image

    export default class StickyHeader extends React.Component {

  static propTypes = {

  }

  static defaultProps = {

  }

  render() {

    const { logo } = this.props;

    return (
      <header>
        <div className={'logo'}>
          {logo}
        </div>
        <div>123</div>
      </header>
    );
  }
}

<StickyHeader logo={ <img src="http://via.placeholder.com/350x150" alt="" /> }></StickyHeader>

Upvotes: 1

Views: 23925

Answers (1)

CD-jS
CD-jS

Reputation: 1119

In this case, I would put the image tag inside your sticky header component, and then pass just the logo url as a property, so your render method would look more like this:

render() {
    const { logoUrl } = this.props;

    return (
      <header>
        <div className={'logo'}>
          <img src={logoUrl} />
        </div>
        <div>123</div>
      </header>
    );
  }
}

and then your usage -

<StickyHeader logoUrl={'http://via.placeholder.com/350x150'} />

Upvotes: 7

Related Questions