Push selected option on click - node.js

Question

Im using Node.js, but i really don't know how i can do this guys, pls help
i need push selected option when user click on button, like a cart.
to before submit
const classes = useStyles();
const [codigo, setCodigo] = useState('');
const [nome, setNome] = useState('');
const [descricao, setDescricao] = useState('');
const [preco, setPreco] = useState('');
const [peso, setPeso] = useState('');
const [itemServico, setItemServico] = useState('');
const [servicos, setServicos] =useState([ ]);
useEffect(() =>{
async function loadServicos(){
const response = await api.get("/api/servicos");
console.log(response.data);
setServicos(response.data);
}
loadServicos();
},[])
how can i do this,
<Grid item xs={12} sm={12}>
<FormControl className={classes.formControl}>
<InputLabel id="demo-simple-select-label"></InputLabel>
<Select
native
labelId="demo-simple-select-label"
id="selectServico"
>
{servicos.map((opcao) => (
<option aria-label="None" value={opcao._id}>{opcao.codigo_servico}" - "{opcao.nome_servico}</option>
))}
</Select>
<Button onClick={itemServico.push(document.getElementById("selectServico"))}>Adicionar</Button>
</FormControl>
</Grid>

Answer 1

You need something like this. Please note that I couldn't througly test this as I don't have the full context of your app.
export default function App() {
const [servicos, setServicos] =useState([]);
const [itemServico, setItemServico] = useState([]);
const select = useEffect();
const add = () => {
if(!itemServico.includes(select.current.value))
setItemServico([...itemServico, select.current.value])
}
return (
<div className="App">
<Select
native
labelId="demo-simple-select-label"
id="selectServico"
ref={select}
>
{servicos.map((opcao) => (
<option aria-label="None" value={opcao._id}>{opcao.codigo_servico}" - "{opcao.nome_servico}</option>
))}
</Select>
<Button onClick={add}>Adicionar</Button>
</div>
);
}
We create a reference to the Select element by using the useRef hook. This will allow us to access the Select's value at any time.
We also create a function, add, that adds the selected option's value to the itemServico array. But it only does so if the value being added does not already exists in the array.
Finally, we use the onClick prop of the button to call the add function. This, in a nutshell, is what you would need.