I'm trying to send a POST request using axios with ReactJS, my POST request will submit when I hit the button, but the data from the textbox is not present. Hoping somebody could point out what I've done wrong. I think I might be going wrong with the state setting.

import React, { Component } from "react";
import axios from "axios";


class SearchBar extends Component {
  state = {
    search: '',
  };

  handleChange = event =>{
    this.setState({ search: event.target.value});
  }
  
  handleSubmit = event => {
    event.preventDefault();
    const data = {
      search: this.state.search
    }
    axios
      .post("http://127.0.0.1:8080/find", {data}) 
      .then(response=>{
        console.log(response);
        this.setState({ data: response.data });
      })
      .catch((error) => {
        console.log(error);
      });
  };

  render() {
    return (
      <div className="post">
        <form className="post" onSubmit={this.handleSubmit}>
          <input
            placeholder="Search for music 'Artist - Track'"
            type="text" name="name" onChange={this.handleChange}/>
          <button type="submit">Search</button>
        </form>
                
        <div>
        {this.state.data}
        </div>
      </div>
    );
  }
}

export default SearchBar;