Essa função está dentro de um map
e dentro do mesmo, executo {Idchecker}
O item.id é um valor que vem no Array, eu preciso deste id para deletar a publicação que o usuário criou, então pego idValue que armazena os identificadores dos posts e comparo com os mesmos existentes, assim, permito que o usuário tenha o botão na sua publicação para deletá-la!
O problema é que o botão está executando sem a ação "clique" do usuário, contudo ao carregar a página é executado de imediato 2 requests de delete.
const [idValue, setIdValue] = useState([702, 704]);
const [verify, setVerify] = useState(true);
function Idchecker() {
for (let i = 0; i < idValue.length; i++) {
if (idValue[i] == item.id) {
if (idValue[0] != null && verify == true) {
return (
<button onClick={Delete(idValue[0])}>DELETE</button>,
setVerify(false)
)
} else if (idValue[0 + 1] != null) {
return (
<button onClick={Delete(idValue[0 + 1])}>DELETE</button>
)
}
}
}
}
// função delete
function Delete(event) {
axios.delete('http://test/delete' + event + '/', {
id: event
}).then(res => { console.log(res) });
}
onClick={this.Delete.bind(this, idvalue[0])}
e mais adianteonClick={this.Delete.bind(this, idvalue[0 + 1])}
não solucionaria o problema?onClick={() => { Delete(idvalue[0 + 1]) }
, caso contrário a função será chamada assim que o componente for renderizado.