I have a React component written in TypeScript:
class App extends React.Component<props> {
constructor(props) {
super(props);
this.treeNavElement = this.treeNavElement.bind(this);
}
treeNavElement() {
return (
<div></div>
)
}
render() {
return (
<div>
{
this.props.NavDataTree.map(function(elem) {
return <div key={elem.id} onClick={this.treeNavElement}>{elem.name}</div>
}, this)
}
</div>
)
}
}
export default App;
My problem is that the typescript compiler yells at me, because of this line:
return <div key={elem.id} onClick={this.treeNavElement}>{elem.name}</div>
Saying:
[ts] 'this' implicitly has type 'any' because it does not have a type annotation.
Outside of map function, in map's second parameter and this.props it works fine, but inside onClick this is lost.
If I set "noImplicitThis": false in tsconfig.json it is fine, but I would like to know if there is a way around this without turning implicitthis off?
...map((elem) => { ... })thisis unknown at compile time insidemap. Again: this is a compile time issue, nukingthiswithanyand zero issues at runtime.this, but now it has a different error.