Как передать значение?

Question

[kentos]

Здравствуйте, как из этого метода вывести в дата, currentCoords

mapCreated: function ($map) {
                let pointOnMap = new ymaps.Placemark([55.7204,37.6200], {}, {
                    draggable: true
                });

                $map.geoObjects.add(pointOnMap);
                this.map = $map;

                let coords = [55.7204,37.6200]

                pointOnMap.events.add("dragend", function (e) {
                    let coords = this.geometry.getCoordinates();
                    let currentCoords = coords[1].toFixed(6) + ',' + coords[0].toFixed(6);
                }, pointOnMap);
            },

Answer 1

[alex]

в начале метода пишите вот это:

mapCreated: function ($map) {
  const _this = this;
//   далее идет код
}

затем меняете let currentCoords на _this.currentCoords

в итоге должно быть вот так:

mapCreated: function ($map) {
  const _this = this
  
  let pointOnMap = new ymaps.Placemark([55.7204,37.6200], {}, {
    draggable: true
  });
  
  $map.geoObjects.add(pointOnMap);
  this.map = $map;
  
  let coords = [55.7204,37.6200]
  
  pointOnMap.events.add("dragend", function (e) {
    let coords = this.geometry.getCoordinates();
    _this.currentCoords = coords[1].toFixed(6) + ',' + coords[0].toFixed(6);
  }, pointOnMap);
}

Comments

[kentos]

Спасибо, а почему так происходит?

[alex]

kentos, в метод .add() вторым аргументом передается функция. когда внутри этой функции вы пишите this то вы обращаетесь к контексту того объекта, в котором эта функция в последующем будет вызвана, а вам нужно обратиться к контекссту экземпляра vue. для этого нужно сделать так, как я написал выше, сохранить нужный вам контекст в переменную. либо можно использовать стрелочные функции, они не создают контекста

pointOnMap.events.add('dragend', e => {
  this.currentCoords
})

. но в вашем случае стрелочные функции не подходят

Answer 2

[nvdfxx]

this.dataCurrentCoords = currentCoords, не?

Comments

[kentos]

мне нужно сюда вот

data() {
            return {
                titles: '',
                currentCoords: ''
            }

Answer 3

[Joss Nix]

заменить

let currentCoords = coords[1].toFixed(6) + ',' + coords[0].toFixed(6);

на

this.currentCoords = coords[1].toFixed(6) + ',' + coords[0].toFixed(6);

При условии, что в data объявлен currentCoords

data() {
    return {
        currentCoords: ''
    ...    
    }

Comments

[kentos]

ничего не выводит(

[Joss Nix]

А можно сделать вывод?
pointOnMap.events.add("dragend", function (e) {
let coords = this.geometry.getCoordinates();
let currentCoords = coords[1].toFixed(6) + ',' + coords[0].toFixed(6);
console.log("currentCoords ", currentCoords );
}, pointOnMap);

currentCoords вообще меняется?

[kentos]

Jossnix, Да, консолил, все выводится

[Joss Nix]

kentos, Хорошо, а можно увидеть часть кода, где вы используете currentCoords (где оно должно меняться, но не меняется)?

[kentos]

Jossnix,

<form class="map_wrapper">
            <div class="map_address _text-center">{{currentCoords}}</div>
            <yandex-map
                    :center="[53.903798,27.560302]"
                    :zoom="11"
                    style="width: 100%; height:100%;"
                    :dragable="true"
                    :scrollZoom="false"
                    @created="mapCreated"
            >

            </yandex-map>

[Joss Nix]

kentos, я так понимаю, что у вас есть дочерний компонент "yandex-map", из которого не передаётся значение.

Попробуйте сделать так:

<yandex-map
        :center="[53.903798,27.560302]"
        :zoom="11"
        style="width: 100%; height:100%;"
        :dragable="true"
        :scrollZoom="false"
        @created="mapCreated"
        @:updateCurrentCoords = "updateCoords"
>

</yandex-map>

в глобальном родительском компоненте добавить метод updateCoords

updateCoords(localCurrentCoord) {
    this.currentCoords = localCurrentCoord;
}

А в метод mapCreated, добавить следующее:

mapCreated: function ($map) {
                let pointOnMap = new ymaps.Placemark([55.7204,37.6200], {}, {
                    draggable: true
                });

                $map.geoObjects.add(pointOnMap);
                this.map = $map;

                let coords = [55.7204,37.6200]

                pointOnMap.events.add("dragend", function (e) {
                    let coords = this.geometry.getCoordinates();
                    let currentCoords = coords[1].toFixed(6) + ',' + coords[0].toFixed(6);
                    this.$emit('updateCurrentCoords', currentCoords)
                }, pointOnMap);
            },

Подробнее можно посмотреть здесь и здесь