uni-app集成leaflet

uni-app是一个支持多平台开发的框架，可以构建一次，发布到iOS、Android、Web等多端。要在uni-app中集成Leaflet地图库，你需要做以下几个步骤：

安装依赖：首先，在uni-app项目的npm或yarn依赖管理中添加Leaflet的官方插件。你可以通过命令行运行：
npm install @vant/weapp-leaflet 或 yarn add @vant/weapp-leaflet
登录后复制

引入组件：在需要使用地图的地方，如pages/index.vue或者其他页面中，导入并注册WxMap组件：
<template>
<view>
<van-map :ref="mapRef" :center="{lng: 116.404, lat: 39.915}" :zoom="14"></van-map>
</view>
</template>

<script setup>
import { WxMap } from '@vant/weapp-leaflet';

const mapRef = ref(null);
// ...其他代码...
</script>
登录后复制

配置地图初始化：在setup文件中，对地图进行初始化配置，例如设置中心点、缩放级别等：
created() {
this.mapRef.value.init({
center: [116.404, 39.915], // 北京坐标
zoom: 14,
});
},
destroyed() {
if (this.mapRef.value) {
this.mapRef.value.destroy();
}
},
登录后复制

添加交互功能：使用Leaflet提供的API，可以添加路径、标记点、事件监听等功能。