Closed fekevin closed 3 years ago
import { useRef, useEffect, useState } from 'react' import { Map, APILoader, useMap } from '@uiw/react-baidu-map' import React from 'react' const Example = () => { const divElm = useRef() const [zoom, setZoom] = useState(15) const { setContainer, map, center, setCenter, setAutoLocalCity } = useMap({ enableScrollWheelZoom: true, // 启用滚轮放大缩小,默认禁用 center: '北京', widget: ['GeolocationControl', 'NavigationControl'] }) useEffect(() => { if (divElm.current && !map) { setContainer(divElm.current) } }) useEffect(() => { if (map) { // 启用滚轮放大缩小,默认禁用 map.setZoom(zoom) } }, [zoom, map]) return ( <> <div style={{ width: '100%', height: '300px' }}>
</div> </> )
} export default Example
已解决
我也有这个问题哎,第一次进来地图不显示,第二次进来就好了,请问是版本几修复了呢
import { useRef, useEffect, useState } from 'react' import { Map, APILoader, useMap } from '@uiw/react-baidu-map' import React from 'react' const Example = () => { const divElm = useRef() const [zoom, setZoom] = useState(15) const { setContainer, map, center, setCenter, setAutoLocalCity } = useMap({ enableScrollWheelZoom: true, // 启用滚轮放大缩小,默认禁用 center: '北京', widget: ['GeolocationControl', 'NavigationControl'] }) useEffect(() => { if (divElm.current && !map) { setContainer(divElm.current) } }) useEffect(() => { if (map) { // 启用滚轮放大缩小,默认禁用 map.setZoom(zoom) } }, [zoom, map]) return ( <> <div style={{ width: '100%', height: '300px' }}>
} export default Example