behavior not expected but working, I need some explanation please - reactjs

Question

I am on the CRUD step with hooks and everything is working but I don't understand why the Axios.post doesn't need .then in this case.
If I send only customer instead customer[0] nothing happens, then the .then(response => console.log(response)) returns nothing. I guess that the customer[0] has already the right format: [{}].
import React, { useState, useEffect } from 'react';
import Axios from 'axios';
import { Form, Container, Col, Row, Button } from 'react-bootstrap';
// import data
import fields from './customerFields'; // <= array of object
function AddCustomers() {
const [customer, setCustomer] = useState([{}]);
const [inputValue, setInputValue] = useState('');
useEffect(() => {
setCustomer([inputValue]);
}, [inputValue]);
const handleSubmit = (event) => {
event.preventDefault();
const newCustomer = [...customer, inputValue];
setCustomer(newCustomer);
const url = 'http://localhost:5000/api/clients';
Axios.post(url, customer[0])
};
const handleChange = (event) => {
event.preventDefault();
const { value } = event.target;
const { name } = event.target;
const newValue = { ...inputValue, [name]: value };
setInputValue(newValue);
};
// return
return (
<Container>
<Row>
<Col className="col-form-label-sm">
<h3 id="">Identité du client</h3>
<Form
action=""
className="form-group"
onSubmit={(event) => handleSubmit(event)}
>
<Form.Group>
<Form.Label>{fields[0].label}</Form.Label>
<Form.Control
name={fields[0].name}
type="text"
value={inputValue.name}
onChange={(event) => handleChange(event)}
/>
</Form.Group>
<Form.Group>
<Form.Label>{fields[1].label}</Form.Label>
<Form.Control
name={fields[1].name}
type="text"
value={inputValue.name}
onChange={(event) => handleChange(event)}
/>
</Form.Group>
<Form.Group>
<Form.Label>{fields[2].label}</Form.Label>
<Form.Control
name={fields[2].name}
type="text"
value={inputValue.name}
onChange={(event) => handleChange(event)}
/>
</Form.Group>
<Button type="submit" variant="warning">
Ajouter un client
</Button>
</Form>
</Col>
</Row>
</Container>
);
}
export default AddCustomers;

Answer 1

You're making an asynchronous operation (Axios.post(url, customer[0])) and not waiting for it to resolve, so you're just leaving the promise floating there. If you don't care if the operation succeed or failed that is fine, but in most cases you want to either handle the error received or do something with the result.
About why Axios.post is accepting customer[0] that's because it accepts anything in the second parameter it can send in a POST request. You're always setting your customer as an array with the inputValue variable inside (setCustomer([inputValue]);) so inputValue is what you send as customer[0].

Answer 2

ohhh! I got it, I think this version is better :
const handleSubmit = (event) => {
event.preventDefault();
const url = 'http://localhost:5000/api/clients';
Axios.post(url, customer);
};
thank you #jonrsharpe