我已經成功地編寫了一個reactjs應用程序。它運作良好。我一直在寫一個新的組件來從狀態中取得緯度和長度的座標,並將其傳遞給我定義的函數handleMouseOver
並將其綁定到this
中,在構造函數中狀態的定義方式與我在其他組件中寫的相同按預期工作。爲什麼我的反應流量函數沒有定義?
這裏是我的代碼:
'use strict';
import React from 'react';
import MapStore from '../../../stores/MapStore';
require('styles/Nav/Nav.scss');
export default class BathroomList extends React.Component {
constructor() {
super();
this.handleMouseOver = this.handleMouseOver.bind(this);
this.state = {
lat: MapStore.getLat(),
long: MapStore.getLong()
}
}
handleMouseOver() {
console.log('Hover' + Date.now())
MapActions.setBathroomListMap(this.state.lat, this.state.long)
}
render() {
let listSrc = MapStore.bathrooms.listSrc;
const bathrooms = MapStore.bathrooms.map(function(bathroom, i, mouseOver) {
return (
<div key={i}>
<div className='bathroom-list' key={i}>
<button onClick={this.handleMouseOver()} ><h1> {bathroom.bathroomName}</h1></button>
<h2>{bathroom.description}</h2>
<div className='dates'>
<div className='date'>Found: {bathroom.date_found}</div>
<div className='date'>Confirmed: {bathroom.last_confirmed}</div>
</div>
</div>
</div>
);
});
return (
<div>
{bathrooms}
<div className='bathroom-map'>
<iframe src={listSrc} className='map-frame' />
</div>
</div>
);
}
}
這是我收到錯誤。
我認爲它沒有在const bathrooms = MapStore.bathrooms.map(function(bathroom, i, mouseOver)
函數的範圍內定義。
請幫忙