Best way to pass an image as props?

Question

I am trying to pass an image as props from a parent component to a child component like this:

Parent:

const StarterContent = {
    image: require('../../assets/images/bike.png'),
    title: 'Starter',
    price: '$149/mo',
    description:
        'Get to know Onfleet. Track, dispatch, manage, and analyze your fleet.',
    buttonText: 'Start Free Trial',
};

...

<PricingCard content={StarterContent} />

Child component:

<Image src={content.image} alt={content.title} />

But the image doesn't render, any idea of what is wrong?

Answer 1

Solution:

Child component:

<Image src={content.image.default} alt={content.title} />