Why is the page blank?

i’m making a website to upload my stories. it will take text files and convert them into various interactive formats.
i made a React component called vibe, which is a window that will display the stories. the second i imported it into home.jsx, the screen went blank. there were no errors thrown, and the only thing i changed was importing vibes.jsx and using the tag. any help?
website

here’s what I’m seeing in my browser console

Uncaught TypeError: this is undefined

Vibe vibes.jsx:7

React 16

index.jsx:5

vibes.jsx:7:7

The above error occurred in the component: Vibe@Hello React! Home App Consider adding an error boundary to your tree to customize error handling behavior. Visit Component – React to learn more about error boundaries.

and that part of the code

    return (
    <div className="vibe">
      {this.props.content} {/* line 7 */}
      </div>
    );

which apparently https://reactjs.org/docs/components-and-props.html#function-and-class-components your code was a mix of code from a “class component” and the declaration of a “function component”

1 Like

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