my-openlayer 1.0.7 → 1.0.9

package/core/Point.d.ts

@@ -79,11 +79,12 @@ export default class Point {
      * 添加vue组件为点位
      * @param pointDataList 点位信息列表
      * @param template vue组件模板
-     * @param Vue Vue实例
+     * @param options 选项，包含Vue实例
      * @returns 返回控制对象，包含显示、隐藏、移除方法
      * @throws 当参数无效时抛出错误
      */
     addVueTemplatePoint(pointDataList: PointData[], template: any, options?: {
+        Vue?: any;
         positioning?: 'bottom-left' | 'bottom-center' | 'bottom-right' | 'center-left' | 'center-center' | 'center-right' | 'top-left' | 'top-center' | 'top-right';
         stopEvent?: boolean;
     }): {

package/core/Point.js

@@ -321,7 +321,7 @@ export default class Point {
      * 添加vue组件为点位
      * @param pointDataList 点位信息列表
      * @param template vue组件模板
-     * @param Vue Vue实例
+     * @param options 选项，包含Vue实例
      * @returns 返回控制对象，包含显示、隐藏、移除方法
      * @throws 当参数无效时抛出错误
      */
@@ -332,6 +332,9 @@ export default class Point {
         if (!template) {
             throw new Error('Vue template is required');
         }
+        if (!options?.Vue) {
+            throw new Error('Vue instance is required in options');
+        }
         try {
             const vueTemplatePoint = new VueTemplatePoint(this.map);
             return vueTemplatePoint.addVueTemplatePoint(pointDataList, template, options);

package/core/VueTemplatePoint.d.ts

@@ -21,6 +21,7 @@ export default class VueTemplatePoint {
      * @returns 点位控制器
      */
     addVueTemplatePoint(pointDataList: any[], template: any, options?: {
+        Vue?: any;
         positioning?: 'bottom-left' | 'bottom-center' | 'bottom-right' | 'center-left' | 'center-center' | 'center-right' | 'top-left' | 'top-center' | 'top-right';
         stopEvent?: boolean;
     }): {

package/core/VueTemplatePoint.js

@@ -2,50 +2,13 @@ import Overlay from 'ol/Overlay';
 import { VueTemplatePointState } from '../types';
 import { ErrorHandler, ErrorType } from '../utils/ErrorHandler';
 import { ValidationUtils } from '../utils/ValidationUtils';
-// 动态导入Vue
-let Vue = null;
-let isVue3 = false;
-// 检测Vue版本并导入
-async function detectAndImportVue() {
-    try {
-        // 尝试动态导入Vue
-        const vueModule = await import('vue');
-        Vue = vueModule.default || vueModule;
-        // 检测Vue版本
-        if (Vue && (Vue.version?.startsWith('3') || Vue.createApp)) {
-            isVue3 = true;
-        }
-        else {
-            isVue3 = false;
-        }
-    }
-    catch (e) {
-        console.warn('Vue not found. Please ensure Vue is installed in your project.');
-        Vue = null;
-    }
-}
-// 浏览器环境的Vue检测
-function detectVueSync() {
-    try {
-        // 从全局对象获取Vue（仅浏览器环境）
-        if (typeof window !== 'undefined' && window.Vue) {
-            Vue = window.Vue;
-            isVue3 = !!(Vue.version?.startsWith('3') || Vue.createApp);
-        }
-        else {
-            console.warn('Vue not found in global scope. Please ensure Vue is loaded before this library.');
-            Vue = null;
-        }
-    }
-    catch (e) {
-        console.warn('Failed to detect Vue:', e);
-        Vue = null;
-    }
-}
-// 初始化Vue导入
-detectVueSync();
-if (!Vue) {
-    detectAndImportVue();
+/**
+ * 检测Vue版本
+ * @param Vue Vue实例
+ * @returns 是否为Vue3
+ */
+function isVue3(Vue) {
+    return !!(Vue && (Vue.version?.startsWith('3') || Vue.createApp));
 }
 /**
  * Vue模板点位管理类
@@ -76,7 +39,12 @@ export default class VueTemplatePoint {
         if (!template) {
             throw new Error('Vue template is required');
         }
+        if (!options?.Vue) {
+            throw new Error('Vue instance is required in options');
+        }
         try {
+            const Vue = options.Vue;
+            const vueIsVue3 = isVue3(Vue);
             const instances = [];
             pointDataList.forEach((pointData) => {
                 if (!ValidationUtils.validateLngLat(pointData.lgtd, pointData.lttd)) {
@@ -95,7 +63,7 @@ export default class VueTemplatePoint {
                     positioning: options?.positioning,
                     stopEvent: options?.stopEvent,
                 };
-                const instance = new VueTemplatePointInstanceImpl(this.map, pointOptions, this.errorHandler);
+                const instance = new VueTemplatePointInstanceImpl(this.map, pointOptions, this.errorHandler, Vue, vueIsVue3);
                 instances.push(instance);
                 this.vuePoints.set(instance.id, instance);
             });
@@ -155,11 +123,13 @@ export default class VueTemplatePoint {
  * @internal
  */
 class VueTemplatePointInstanceImpl {
-    constructor(map, options, errorHandler) {
+    constructor(map, options, errorHandler, Vue, isVue3) {
         this.app = null;
         this.state = VueTemplatePointState.CREATED;
         this.map = map;
         this.errorHandler = errorHandler;
+        this.Vue = Vue;
+        this.isVue3 = isVue3;
         this.options = this.mergeDefaultOptions(options);
         this.id = this.generateUniqueId();
         this.position = [this.options.lgtd, this.options.lttd];
@@ -244,13 +214,13 @@ class VueTemplatePointInstanceImpl {
      */
     createVueApp() {
         const { Template, props } = this.options;
-        if (!Vue) {
-            throw new Error('Vue is not available. Please ensure Vue is installed in your project.');
+        if (!this.Vue) {
+            throw new Error('Vue is not available. Please ensure Vue instance is provided.');
         }
         try {
-            if (isVue3) {
+            if (this.isVue3) {
                 // Vue 3
-                this.app = Vue.createApp({
+                this.app = this.Vue.createApp({
                     ...Template,
                     props: props || {}
                 });
@@ -258,7 +228,7 @@ class VueTemplatePointInstanceImpl {
             }
             else {
                 // Vue 2
-                this.app = new Vue({
+                this.app = new this.Vue({
                     el: this.dom,
                     render: (h) => h(Template, { props: props || {} })
                 });
@@ -425,7 +395,7 @@ class VueTemplatePointInstanceImpl {
     destroyVueApp() {
         if (this.app) {
             try {
-                if (isVue3) {
+                if (this.isVue3) {
                     // Vue 3: 使用 unmount
                     this.app.unmount();
                 }

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "my-openlayer",
   "private": false,
-  "version": "1.0.7",
+  "version": "1.0.9",
   "type": "module",
   "main": "index.js",
   "types": "index.d.ts",