ReactJS Axios GET-запрос Функция не возвращает данные

Есть файл http.js, где есть функция getPost(), которая получает данные с API

import axios from 'axios';
export function getPost(){
    const axios = require('axios');
    axios.get('http://127.0.0.1:8000/mls/p/')
    .then(function(response){
        // console.log(response.data.posts)
        return response.data
    })
    .catch(function(error) {
        console.log(error)
    })
}

Но она не работает ни в каких компонентах (не возвращает response.data), только выводится в консоль, если убрать комментарий

В app.js не хочет выводить, хотя метод POST работал и работает идеально

В дочернем компоненте posts.js тоже не возвращает значение response.data

app.js

import { getPost } from './components/api/http';
class App extends Component {
    constructor(props) {
      super(props);
      this.state = {
        dataGetPosts: [] }}

    componentDidMount() {
      this.setState({
        dataGetPosts: getPost()
      });
      console.log(this.state.dataGetPosts) // Здесь выводится []
      // Даже если заменить в state [] на "", то будет выводится пустая строка
      // Также, если еще убрать полностью state из конструктора, то выведет ошибку
    }
    
    render() {
      return (<div>
            <Posts data={this.state.dataGetPosts}/>
        </div>)}}
export default App;

В posts.js

import React, { Component } from 'react'
import { getPost } from '../api/http';
class Posts extends Component{
    constructor(props) {
        super(props);
        this.state = {
            isLoaded: false,
        };
        this.clickbtn = this.clickbtn.bind(this);
        // console.log(this.props.data); 
        // Здесь выведет []
        }

    clickbtn() {
        let data = getPost()
        console.log("data", data); }
        // Даже при таком методе - выводит undefined

    render() {
        return(<div>
                <button onClick={this.clickbtn}>test 2</button>
            </div>)}}
export default Posts;

В чём-то проблема или неправильно написан код и нужно переписать?

import axios from 'axios';
export function getPost(){
    const axios = require('axios');
    return axios.get('http://127.0.0.1:8000/mls/p/')
    .then(function(response){
        // console.log(response.data.posts)
        return response.data
    })
    .catch(function(error) {
        console.log(error)
    })
}