Ravenous part-2: TypeError I am unable to solve

This is the error when I run the project:
The error is in BusinessList.js at line 9 as per the log:

TypeError: this.props.businesses is undefined
render
src/components/BusinessList/BusinessList.js:9

6 | class BusinessList extends React.Component {
7 |     render() {
8 |         return(
9 |             <div className="BusinessList">
10|               {
11|                 this.props.businesses.map(business => {
12|                   return <Business business={business} />

Here is my BusinessList Component:

class BusinessList extends React.Component {
    render() {
        return(
            <div className="BusinessList">
              {
                this.props.businesses.map(business => {
                  return <Business business={business} />
                })
              }
            </div>
          );
    }
}

And here is a snippet from App.js including businesses array and App component

const businesses = [ business, business, business, business, business, business ]

class App extends React.Component {
  render() {
    return (
      <div className="App">
        <h1>ravenous</h1>
        <SearchBar />
        <BusinessList business={businesses} /> 
      </div>
    );
  }
}

Help would be appreciated.

Edit: Wrote App.js again from scratch and this time it worked! :smiley:

Make sure you’re using the same name for the attribute you’re passing in to BusinessList and the prop inside of BusinessList

I’ve cross checked it several times…

<BusinessList business ={businesses} />

this.props. businesses .map

They are different.

Like @ktsotras stated you are passing BusinessList a prop of business in app.js

Then trying to call that prop in BusinessList.js, but adding es onto the end of the business.