How can i handle onchange event for multiple map select elements?

[ernest_5]

Hi
i have a couple of select element which are returned from a map function. When i try to change the value/option of one select element all the other select elements options change according to the option i select for the one and i don't want that. I want all the other select element to change only when i select an option from them. I Have been battling to achieve this and it seems i can't really get the hang of it considering i just started learning react. I could really use some help. Below is my code snippet. Thanks

import React ,{useContext, useState} from 'react';
import {GlobalContext} from '../context/GlobalState';

const Cart = () => {
    const [options, setOptions] = useState(1);

}
return (
            <select value={options} onChange={(e)=>setOptions(e.target.value)}>
                    <option value="1">1</option>
                    <option value="2">2</option>
                    <option value="3">3</option>
                    <option value="4">4</option>
                    <option value="5">5</option>
                    <option value="6">6</option>
                    <option value="7">7</option>
                    <option value="8">8</option>
                    <option value="9">9</option>
                    <option value="10">10</option>
                  </select> 
                 }
        export default Cart;