Javascript '；outerMap'；未定义无未定义

我目前正在做我的Udacity课程的最后一个项目。我目前收到以下错误，似乎无法修复。我希望有人能帮助我。我将在下面发布代码

“/src/components/Map.js第86行：'outerMap'未定义无未定义”

我是stackoverflow的新手，所以我不确定我是否做对了

import React，{Component}来自“React”
从“/ListLocations”导入ListLocations
类映射扩展组件{
状态={
映射：{}，
中心：{}，
信息窗口：{}，
标记：[]，
地图标记：[]，
默认图标：{}，
highlightedIcon:{}
}
initMap=（中间）=>{
返回新的window.google.maps.Map（document.getElementById（'Map'）{
中心：中心位置，
缩放：11
})
}
hideMarkers=（地图标记）=>{
mapMarkers.forEach（（mapMarker）=>{
mapMarker.setMap（空）
})
}
addMarkers=（地图、标记、信息窗口）=>{
const outerMap=此
//列表标记图标。
const defaultIcon=this.makeMarkerIcon（'0091ff'）
//创建一个“突出显示的位置”标记颜色，以便用户将鼠标悬停在该位置上
const highlightedIcon=this.makeMarkerIcon（'ffffff24'））
让mapMarkers=[]
markers.forEach（（marker）=>{
设m=newwindow.google.maps.Marker({
位置：marker.location，
地图：地图，
标题：marker.title，
图标：默认图标
})
地图标记。推送（m）
m、 addListener（'单击'，函数（））{
outerMap.PopulateInfo窗口（m，信息窗口）
})
m、 addListener（'mouseover'，function（）{
此.setIcon（highlightedIcon）
})
m、 addListener（'mouseout'，function（）{
this.setIcon（defaultIcon）
})
})
this.setState（{mapmarks:mapmarks，defaultIcon:defaultIcon，highlightedIcon:highlightedIcon}）
}
fetchFromWikipedia=（标记、信息窗口、地图）=>{
const search=marker.title.split（“”）.join（“”）
常量url=https://en.wikipedia.org/w/api.php?action=query&origin=*&prop=extracts&exintro&titles='+search+'&format=json&utf8'
让extract=''
获取（url{
方法：“POST”，
标题：新标题（{
“Api用户代理”：“示例/1.0”
} )
}）。然后（功能（响应）{
如果（response.ok）{
返回response.json（）；
}
抛出新错误（“网络响应不正常：”+response.statusText）；
}）。然后（函数（数据）{
//处理数据
const pages=data.query.pages
extract=pages[Object.keys（pages）[0]]。extract
const firstparation=extract.slice（0，extract.indexOf（'
'）+'
'.length）
常量页面链接=``
outerMap.fillInfoWindow（标记、信息窗口、地图、第一段+页面链接）
});
}
fillInfoWindow=（标记、信息窗口、地图、wikiData）=>{
infowindow.marker=marker
infowindow.setContent（`${marker.title}${wikiData}`）
信息窗口。打开（地图、标记）
infowindow.addListener（'closeclick'，function（）{
infowindow.marker=null
})
}
PopulateInfo窗口=（标记、信息窗口、地图）=>{
//检查以确保标记上的信息窗口尚未打开。
如果（infowindow.marker！==marker）{
这个.fetchFromWikipedia（标记、信息窗口、地图）
}
}
makeMarkerIcon=（markerColor）=>{
让markerImage=new window.google.maps.markerImage(
'http://chart.googleapis.com/chart?chst=d_map_spin&chld=1.15|0 |'+标记颜色+
“| 40 | | |%E2%80%A2”，
新窗口。谷歌。地图。大小（21，34），
新建window.google.maps.Point（0,0），
新窗口。谷歌。地图。点（10，34），
新窗口。谷歌。地图。大小（21,34））
返回标记图像
}
初始化设置=（）=>{
常数中心={
标题：“都柏林”，地点：{
“lat”：53.350140，
“液化天然气”：-6.266155
}
}
常量标记=[
{标题：“吉尼斯仓库”，地点：{
“lat”：53.341874，
“液化天然气”：-6.28670929999984
}},
{标题：“圣帕特里克大教堂”，地点：{
“纬度”：53.3395154，
‘液化天然气’：-6.27147669994
}},
{标题：“圣斯蒂芬斯格林”，地点：{
“lat”：53.340037，
“液化天然气”：-6.2603841999976
}},
{标题：“3Arena”，地点：{
“纬度”：53.3474963，
“液化天然气”：-6.22850779999885
}},
{标题：“都柏林港”，位置：{
“纬度”：53.3495886，
“液化天然气”：-6.207789100014
}}
]
让map=this.initMap（中间）
让infowindow=newwindow.google.maps.infowindow（{maxWidth:200}）
此.addMarkers（地图、标记、信息窗口）
this.setState（{map:map，markers:markers，center:center，infowindow:infowindow}）
}
componentDidMount（）{
window.initSetup=this.initSetup
loadMapAsync（'https://maps.googleapis.com/maps/api/js?key=AIzaSyASRt2d-RHvAVmNubKvy90St01BcJNaTP8&callback=initSetup'）
}
render（）{
const{map，markers，mapmarks，infowindow，defaultIcon，highlightedIcon}=this.state
返回(
)
}
}
导出默认映射
函数loadMapAsync（src）{
var s=document.createElement（'script'）
s、 类型='text/javascript'
s、 异步=真
s、 src=src
s、 onerror=（）=>{
警报（'无法加载Google地图API'）
}
var x=document.getElementsByTagName（'script'）[0]
x、 parentNode.insertBefore（s，x）
}

您在

addMarkers

函数中定义了

outerMap

，但在

fetchFromWikipedia

函数中也使用了它，而没有定义它。您还必须在该函数中定义它

fetchFromWikipedia = (marker, infowindow, map) => {
    const outerMap = this
    const search = marker.title.split(' ').join('_')

    // ...
}

---

您正在

addMarkers

函数中定义

outerMap

，但也在

fetchFromWikipedia

函数中使用它，而不声明它。您也必须在该函数中声明它。非常感谢！我没在想。现在工作：）