ボタンをクリックするまでまだ存在しないデータにaddListenerを呼び出すメソッドがあります。ただし、そのデータを状態内に設定しようとすると、次のエラーが発生します。
TypeError:this.setStateは関数ではありません
私は次のようにdataHandlerをバインドしようとしました:
this.dataHandler = this.dataHandler.bind(this)
それでも、このエラーが返されます。ここで何を忘れているのですか?
constructor(props){
super(props)
this.state = {
selActive: 4,
loaded: false,
mapInfo: ''
}
this.onScriptLoad = this.onScriptLoad.bind(this)
this.dataHandler = this.dataHandler.bind(this)
}
dataHandler = (getJson) => {
fetch(getJson)
.then(response => response.json())
.then(featureCollection =>
dataLayer = map.data.addGeoJson(featureCollection)
);
map.data.addListener('mouseover', function(event) {
map.data.revertStyle();
map.data.overrideStyle(event.feature, {fillColor: 'blue'});
// THIS IS WHERE I ADD MY SETSTATE.
// HOWEVER, THIS RETURNS AN ERROR ON HOVER
this.setState({mapInfo: event.feature.countryNL})
});
}
JavaScriptthis
では、実行中の関数の「所有者」を常に参照します。つまり、関数がメソッドであるオブジェクトを参照します。代わりに矢印関数を使用してください。矢印関数には独自のthis/super/arguments
バインディングはありません。親の字句スコープからそれらを継承します。
map.data.addListener('mouseover', (event) => {
map.data.revertStyle();
map.data.overrideStyle(event.feature, {fillColor: 'blue'});
// THIS IS WHERE I ADD MY SETSTATE.
// HOWEVER, THIS RETURNS AN ERROR ON HOVER
this.setState({mapInfo: event.feature.countryNL})
});
参照:
この記事はインターネットから収集されたものであり、転載の際にはソースを示してください。
侵害の場合は、連絡してください[email protected]
コメントを追加