data is not defind when page is generate

Question

I don't know why whene i start my server, the eror modal say 'data is not defind'. But i defind the data content.

export default class App extends Component {
data = [
  {
    key: 'john',
    value: 'John Doe',
  },
  {
    key: 'jane',
    value: 'Jane Doe',
  },
  {
    key: 'mary',
    value: 'Mary Phillips',
  },
  {
    key: 'robert',
    value: 'Robert',
  },
  {
    key: 'karius',
    value: 'Karius',
  },
]

render() {
  return (
    <ReactSearchBox
      placeholder="Search for John, Jane or Mary"
      data={data}
      onSelect={record => console.log(record)}
      onFocus={() => {
        console.log('This function is called when is focussed')
      }}
      onChange={value => console.log(value)}
      fuseConfigs={{
        threshold: 0.05,
      }}
      value="John"
    />
  )
}

}

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Duis placerat sapien nec purus sagittis vestibulum. Nulla sed eros ut nisi rutrum finibus sit amet quis diam. Morbi arcu libero, imperdiet vel vestibulum eu, ullamcorper eu nunc. Vestibulum ante ipsum primis in faucibus orci luctus et ultrices posuere cubilia curae; Quisque sit amet finibus odio. N

Answer 1

you need to add const before data.