0
I have a component user-defined
called <Match>
that is created dynamically within another component <Event>
. But when putting onClick on the component an exception is popped. How to solve the problem, being that for each component created dynamically I need onClick that in the future will create a new component.
Events.js:121 Uncaught Typeerror: Cannot read Property 'addBetCard' of Undefined(...)
Event js.
createMatch (match) {
return <Match source={match} key={match.id} onClick={this.addBetCard.bind(this)}/>;
}
createMatches (matches) {
return matches.map(this.createMatch);
}
render() {
return(
...
<div className="ListMatches">
{this.createMatches(dataFake)}
</div>
)}
Temporary output, how to improve?
My purpose is to have onClick inside the component <Match>
and every time you click on the component call onClick of that component.
addBetCard(item){
console.log("Adicionando item");
}
createMatch (match) {
return <a key={match.id} onClick={this.addBetCard.bind(this, match)}><Match source={match}/></a>;
}
createMatches (matches) {
return matches.map((i) => this.createMatch(i));
// return matches.map(this.createMatch);
}
render() {
return(
...
<div className="ListMatches">
{this.createMatches(dataFake)}
</div>
)}
The chunk of code I put just above solves my problem, that when you click on the component to call its onClick method. But it’s a very elegant exit where I need to put my component <Match>
within a tag <a>
which in turn has onClick.
The
=
and a}
there... must beonClick={this.addBetCard.bind(this)}
– Sergio
The
=
after theonClick
... I don’t see where the variabledataFake
is used. The problem still remains?– Sergio
Thanks. Any suggestions on how to solve the problem?
– LuKs Sys
Uses this.createMatches.call(this, dataFake)
– Sergio