Как исправить проблему с распознаванием props?

Question

[gazes12]

App.js:

import React from 'react';
import TotalOnline from './components/TotalOnline';

function App() {
  getApi = async (e) =>{
    e.preventDefault();
    const api = fetch('#########');
    const data = api.json();
    console.log(data);
  }

  return (
    <div className="App">
      <TotalOnline lookOnline={this.getApi}/>
    </div>
  );
}

export default App;

Сам компонент:

import React, { Component } from 'react'

export default class totalOnline extends Component {
  render() {     
    return (
      <div>
        <form onSubmit={this.props.lookOnline}>
            <button type='submit'>Показать онлайн</button>
        </form>
      </div>
    )
  }
}

Буду очень благодарен за помощь!

Выдает ошибку:
Line 5:3: 'getApi' is not defined no-undef

Comments

[Алексей Абрамов]

У тебя App не класс, а функция.this.getApi -> getApi и const getApi = async (e) =>{

[gazes12]

Огромное спасибо!