setState of React.js is not updating the UI?

Question

im new to React so this might be a easy question but i cant seem to get my code working after 4 days of trying. I have a simple app that makes a restCall to my backend and then it should render the result of that call to my UI. The restCall is working and i get the expected result, but when i set the result into my state the ui never gets updated, also no code after setState is being called. The callbackFunction of setStates is also not being called. I looked into this answer already but that did not quite help me. My code is based on the example starter App that gets generated.

import React, { Component } from 'react';
import logo from './logo.svg';
import Greeting from './components/greeting';
import './App.css';

const axios = require('axios');

class App extends Component {
  constructor(props) {
    super(props);
    this.state = {name: "World"};
  }

  componentDidMount() {
    axios({
      method:'get',
      url:'http://localhost:8080/hello?name=Marcus'
    }).then(function (response) {
      console.log(response.data.name);
      console.log("test");
      this.setState({ name : "kotlin"});
      console.log("danach");
    });
  }

  render() {
    return (
      <div className="App">
        <header className="App-header">
          <img src={logo} className="App-logo" alt="logo" />
          <p>
            Edit <code>src/App.js</code> and save to reload.
          </p>
            <Greeting data={this.state}/>
          <a
            className="App-link"
            href="https://reactjs.org"
            target="_blank"
            rel="noopener noreferrer"
          >
            Learn React
          </a>
        </header>
      </div>
    );
  }

}

export default App;


import React, { Component } from 'react';

export default class Greeting extends Component {

    render(){
        let data = this.props.data
        //console.log({data})
        return(<h1>Hello {data.name}</h1>)
    }
}

Any help is highly appreciated.