Trying to read an array from a file in React, but it comes up undefined

I’m new to React and am working on a small project. I’m trying to figure out why React won’t read the data from my dataArray.js file. It comes up undefined when I console.log it. I made sure the data was being exported, the data was connected to the App.js file, and I have the data listed in the state.

I’m stumped as to what else to try.

import "./styles.css";
import { receiptsData } from "./dataArray";
import { Component } from "react";
import Receipt from "./components/Receipt";

class App extends Component {
  state = {
    receiptsData
  };
  render() {
    console.log(receiptsData);
    return (
      <div className="App">
        <Receipt receipts={this.state.receiptsData} />

      </div>
    );
  }
}
export default App;

I have a copy on condesandbox.io: https://codesandbox.io/s/korillaapp-0pm5y3

I know I’m getting other errors as well, but I think it’s tied to not being able to read the data from the dataArray.js file.

>Solution :

You exported your array as default export, so it should be imported like this :

import receiptsData from "./dataArray";

Or change your export like this :

export const receipts = [...]