Quando uso este evento ele não me retorna o real alvo do evento, e sim o próximo elemento com posição equivalente a este. Alguém saberia me dizer o que está acontecendo ?
Você está vendo a versão anterior da nova experiência da Alura que estamos preparando para você. Em breve, ela ganha uma identidade visual novinha totalmente pensada em potencializar seus estudos!
Quando uso este evento ele não me retorna o real alvo do evento, e sim o próximo elemento com posição equivalente a este. Alguém saberia me dizer o que está acontecendo ?
Fala Emily, tudo bem?
Então, a propriedade target do evento, serve para isso, que retorna o elemento que chamou o evento.
Talvez esse seu problema esteja ocorrento por causa do efeito bubbling (veja sobre isso aqui: https://medium.com/totvsdevelopers/event-bubbling-no-javascript-9d6a8da32854#:~:text=O%20princ%C3%ADpio%20do%20efeito%20bubbling%20no%20JavaScript%20%C3%A9%20exatamente%20o%20mesmo.&text=O%20efeito%20de%20%E2%80%9Cborbulhamento%E2%80%9D%20se,e%20depois%20o%20elemento%20pai.)
É possível resolver isso com usando o metodo stopPropagation no evento. Ex: event.stopPropagation()
Continua dando o mesmo erro aqui :(
Consegue me dar um exemplo do que está ocorrendo?
runningTheGame(event){
event.stopPropagation()
console.log(event.target)
if(this.index<8){
this.numQuestion = parseInt(Math.random() * 9);
let newText = this.questions[this.numQuestion].text;
let newAnswers = this.questions[this.numQuestion].answers;
const newState = {
text: newText,
answer: newAnswers
}
this.setState(newState);
this.index++
}
}
render(){
return(
<>
<p>{this.questions[this.numQuestion].text}</p>
<div onClick = {this.runningTheGame.bind(this)}>
<button>{this.questions[this.numQuestion].answers[0].a}</button>
<button>{this.questions[this.numQuestion].answers[1].b}</button>
<button>{this.questions[this.numQuestion].answers[2].c}</button>
<button>{this.questions[this.numQuestion].answers[3].d}</button>
</div>
</>
)
};Esse é o meu código. Estou tentando pegar o alvo do evento de click, só que isso não está acontecendo, já que ele me devolve o próximo elemento com posição equivalente ao real alvo.
Emilly, pelo que estou vendo, o certo seria que você colocasse o evento de onClick nos buttons, não na div
Fiz o que você falou e continua dando o mesmo erro... : (
Você removeu o onClick da div?
Sim, coloquei eles nos botões como você disse !
Poderia por favor, nos mandar o código completo pelo github?