I have two functions , one of them adds an item in array and the other one delete from that array using React JS (hooks).[Both are handler of click event].  

What I have works incorrectly.

``id`` comes from ``contact.length`` and I deleted it with``contacts.splice(id, 1)``.  

I dont have any idea why it has this problem.  

it doesnt delete what would be clicked but a random one.

```
function handleAddRecord(nameValue, phoneValue) {
        setContacts([...contacts , {
            id : contacts.length,
            name : nameValue,
            phone : phoneValue
        }])
    }

    function handleDelete(id) {
        console.log("manager", id);
        const newContacts =  contacts.splice([id],1);
        setContacts([...newContacts]);
    }

```