React项目使用百度地图组件，获取百度地图ak

最新推荐文章于 2024-10-11 08:05:25 发布

执余一念

最新推荐文章于 2024-10-11 08:05:25 发布

阅读量558

点赞数

文章标签：前端

本文链接：https://blog.csdn.net/qq_31794615/article/details/126145582

版权

百度地图组件点这里

首先需要有一个百度地图的账号：点击进入百度地图首页

注册完成后，进入-控制台 -->> 应用管理 -->> 我的应用

点击创建应用，

最后就可以拿到需要的ak了

在react项目中，我们可以这么用

import React, { Component } from 'react';
import { Map, APILoader } from '@uiw/react-baidu-map';

export default class BaiduMap extends Component {
    render() {
        return (
            <div style={{
                width: '900px',
                height: '500px',
            }}>
                <APILoader akay="zMIr6cL***你自己的ak">
                    <Map
                        ref={(props) => {
                            if (props && props.map) {
                                // 启用滚轮放大缩小，默认禁用
                                props.map.enableScrollWheelZoom();
                            }
                        }}
                        autoLocalCity />
                </APILoader>
            </div>
        )
    }
}