Метод "load" не определен в экземпляре, но на него ссылаются во время ошибки рендеринга при интеграции пакета @ syncfusion / ej2-vue-maps - PullRequest
0 голосов
/ 27 мая 2019

Конфигурация: Система: Windows 10 Технология: Vuejs Версия узла: v10.14.1 Версия Npm: 6.4.1 Описание: Здравствуйте! Я использую пакет @ syncfusion / ej2-vue-maps для интеграции карты ниже в мой проект vuejs. Maps · Marker · Syncfusion Vue UI Components

Я добавил следующие строки кода в файл main.js:

import { MapsPlugin, Marker, MapsTooltip, MapAjax } from '@syncfusion/ej2-vue-maps';
Vue.use(MapsPlugin);

После добавления вышеуказанной строки кода. Я создал новый файл, в который я добавил код для отображения карт с маркером. Вот мой файл Maps.vue

<template>
  <div>
     <ejs-maps id='container' :load='load' :titleSettings='titleSettings' :zoomSettings='zoomSettings' :useGroupingSeparator='useGroupingSeparator' format='n'>
       <e-layers>
         <e-layer :shapeData='shapeData' :dataSource='dataSource' :shapeSettings='shapeSettings' :markerSettings='markerSettings'></e-layer>
        </e-layers>
      </ejs-maps>
 </div>
</template>

<script>
import { Marker, MapsTooltip, MapAjax } from '@syncfusion/ej2-vue-maps';
import { topPopulation } from './map-data/marker-location.js';
import Template from './marker-temp.vue';

export default {
   data(){
      return{
         useGroupingSeparator: true, 
         zoomSettings: {
            enable: false
         },
         titleSettings: {
            text: 'Top 25 populated cities in the world',
            textStyle: {
               size: '16px'
            }
         },
         shapeData: new MapAjax('./map-data/world-map.js'),
         dataSource: topPopulation,
         shapeSettings: {
            fill: '#C3E6ED'
         },
         markerSettings: [
            {
               dataSource: topPopulation,
               visible: true,
               animationDuration: 0,
               shape: 'Circle',
               fill: 'white',
               width: 3,
               border: { width: 2, color: '#285255' },
               tooltipSettings: {
                  template: function () { return {template: Template}; },
                  visible: true,
                  valuePath: 'population',
               }
            }
         ]
      }
   },
   provide: {
      maps: [Marker, MapsTooltip]
   }
}
</script>

При запуске проекта я получил ошибку ниже: Property or method "load" is not defined on the instance but referenced during render. Какую ценность мы получаем в нагрузке? Нагрузка также не определена в данных, так откуда мы получаем значение нагрузки? Также я не нашел ни одного файла "marker-temp.vue" после установки библиотеки, из-за которого он показывает ошибку отсутствующего файла. Где это находится? Пожалуйста помоги. Что-то мне не хватает?

1 Ответ

0 голосов
/ 27 мая 2019

Вам не хватает нагрузки в ваших данных (), поэтому вы должны определить нагрузку,

Вы ссылаетесь на то, что не существует.Вы должны проверить документацию компонента, который вы используете, и посмотреть, какую структуру нагрузки они ожидают от вас, а затем определить ее.

data(){
  return{
    load: ""
  }
}

просмотрев документацию, я нашел это, проверьте это ссылка

...