How to receive data using file_get_contents? - php

Question

Here I am trying to send my js object from react app to php file with the help of axios but I am not getting my data there instead it is returning null and connection is made successfully between react and php beacuse if I echo something in php it works but when I try to print object data it returns null so someone can please help me
import { useState } from "react";
import axios from "axios";
const App = () => {
const [username, setUsername] = useState();
const [password, setPassword] = useState();
let [input, setInput] = useState({ username: "", password: "" });
const nameChangeHandler = (e) => {
setUsername(e.target.value);
};
const passwordChangeHandler = (e) => {
setPassword(e.target.value);
};
const formHandler = (e) => {
e.preventDefault();
setInput(((input.username = username), (input.password = password)));
JSON.stringify(input);
axios.post("http://localhost:80/api/index.php", input);
console.log(input);
};
return (
<form onSubmit={formHandler}>
<label>Username</label>
<input type="text" onChange={nameChangeHandler} />
<label>Password</label>
<input type="password" onChange={passwordChangeHandler} />
<input type="submit" />
</form>
);
};
export default App;
PHP:
<?php
header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Headers: *");
$data = json_decode( file_get_contents("php://input"));
print_r($data);
var_dump($data);
?>