Javascript 如何将嵌套常量导出到另一个组件

在下面的示例中，我遇到了如何导出嵌套常量“mapObj”的问题，因为我需要在另一个组件中使用它来从该对象获取一些信息。当我想导出嵌套常量时，我有一个错误，您只能在顶部导出

第一部分：

const Mapper = ({
                    componentId,
                    width,
                    height,
                    xRenderCoord,
                    yRenderCoord,
                    zoom,
                    projection,
                    markerLayers = new TileLayer({
                        source: new OSM()
                    })
                }) => {
    const initMap = () => {
      const mapObj = new Map({
            controls: controls,
            target: componentId === '' ? 'map' : componentId,
            layers: [
                new TileLayer({
                    source: new OSM()
                }),
                markerLayers
            ],
            view: new View({
                projection: projection,
                center: fromLonLat([xRenderCoord, yRenderCoord]),
                zoom: zoom
            })
        })
    }

    useEffect(() => {
        initMap()
    }, [])

    return (
        <React.Fragment>
            <div
                id={componentId === '' ? 'map' : componentId}
                style={{
                    width: width,
                    height: height
                }}
            />
        </React.Fragment>
    )
}

export default Mapper

const MapService = (props) => {

async function vectorLoader(data) {
        var geoJsonFormat = new GeoJSON();
        var features = geoJsonFormat.readFeatures(data, {
            featureProjection: mapObj.getView().getProjection()
        })
    }

 return (
        <>
            <Mapper
                componentId='map'
                width='800px'
                height='800px'
                xRenderCoord={19}
                yRenderCoord={52}
                zoom={6}
                projection='EPSG:3857'
                
            />
        </>
    )
}

const映射器=({
组件式，
宽度，
高度，
xRenderCoord，
yRenderCoord，
快速移动
投影，
markerLayers=新瓷砖层({
资料来源：新OSM（）
})
}) => {
常量initMap=（）=>{
const mapObj=新地图({
控件：控件，
目标：componentId==''？“映射”：componentId，
图层：[
新瓦工({
资料来源：新OSM（）
}),
markerLayers
],
视图：新视图({
投影：投影，
中心：fromLonLat（[xRenderCoord，yRenderCoord]），
缩放：缩放
})
})
}
useffect（（）=>{
initMap（）
}, [])
返回(
)
}
导出默认映射器

第二部分：

const Mapper = ({
                    componentId,
                    width,
                    height,
                    xRenderCoord,
                    yRenderCoord,
                    zoom,
                    projection,
                    markerLayers = new TileLayer({
                        source: new OSM()
                    })
                }) => {
    const initMap = () => {
      const mapObj = new Map({
            controls: controls,
            target: componentId === '' ? 'map' : componentId,
            layers: [
                new TileLayer({
                    source: new OSM()
                }),
                markerLayers
            ],
            view: new View({
                projection: projection,
                center: fromLonLat([xRenderCoord, yRenderCoord]),
                zoom: zoom
            })
        })
    }

    useEffect(() => {
        initMap()
    }, [])

    return (
        <React.Fragment>
            <div
                id={componentId === '' ? 'map' : componentId}
                style={{
                    width: width,
                    height: height
                }}
            />
        </React.Fragment>
    )
}

export default Mapper

const MapService = (props) => {

async function vectorLoader(data) {
        var geoJsonFormat = new GeoJSON();
        var features = geoJsonFormat.readFeatures(data, {
            featureProjection: mapObj.getView().getProjection()
        })
    }

 return (
        <>
            <Mapper
                componentId='map'
                width='800px'
                height='800px'
                xRenderCoord={19}
                yRenderCoord={52}
                zoom={6}
                projection='EPSG:3857'
                
            />
        </>
    )
}

constmapservice=（道具）=>{
异步函数向量加载器（数据）{
var geoJsonFormat=new GeoJSON（）；
var features=geoJsonFormat.readFeatures（数据、{
featureProjection:mapObj.getView（）.getProjection（）
})
}
返回(
)
}

---

您有什么办法解决这个问题吗？

您不能导出未在模块顶层定义的内容。在您的例子中，

mapObj

是在

initMap

函数中定义的，这意味着A）它可能根本不存在（如果从未调用该函数），这使得导出变得困难。：-）和B）可能存在多个

mapObj

s（每次调用

initMap

时一个）

因此，如果您想要导出它，您必须在模块的顶层定义它，如果可行的话。考虑到它似乎取决于

Mapper

函数的参数值（以及一些

控件未在所示代码中声明的
变量），它看起来并不立即可行