N
N
nurzhannogerbek2018-11-30 08:31:14
JavaScript
nurzhannogerbek, 2018-11-30 08:31:14

How to pass data between hooks in vue.js?

Hello comrades! I'm currently learning vue.js and would like to ask you for advice on two issues.
Question 1 :
In the created() hook, I made a get request to the URL via the axios package . In this hook, I created an array of coordinates which I filled with data. When I try to use this array in another hook, for example in mounted() , I see in the console not an array, but [__ob__: Observer]. What is the correct way to use data from one hook in another?
Question 2 :
In the setIncidents function, I am trying to add a label (marker) to a map that I have initialized in another function. What is the best way to proceed?

Uncaught TypeError: ymaps.Placemark is not a constructor at VueComponent.setIncidents

js code :
export default {
        name: "YandexMap",
        data() {
            return {
                coordinates: [],
            }
        },
        created() {
            axios.get('URL').then(response => {
                let coordinates = [];
                for (let i = 0; i < response.data.length; i++) {
                    coordinates.push([response.data[i]["LATITUDE"], response.data[i]["LONGITUDE"]]);
                }
                this.coordinates = coordinates;
            }).catch(error => {
                this.errors.push(error);
            });
        },
        mounted() {
            let scriptYandexMap = document.createElement('script');
            scriptYandexMap.setAttribute('src', 'https://api-maps.yandex.ru/2.1/?lang=ru_RU');
            document.head.appendChild(scriptYandexMap);
            scriptYandexMap.addEventListener("load", this.initializeYandexMap);
            console.log(this.coordinates); <-- ???
        },
        methods: {
            initializeYandexMap() {
                ymaps.ready(function(){
                    const map = new ymaps.Map("yandex-map", {
                        center: [
                            48.352571497155054,
                            64.04235076905002
                        ],
                        zoom: 5,
                        controls: [
                            zoomControl,
                            searchControl,
                            'fullscreenControl'
                        ]
                    });
                });
            },
            setPlacemark() {
                for (var i; i < this.coordinates.length; i++){
                    var placemark = new ymaps.Placemark(this.coordinates[i]);
                    map.geoObjects.add(placemark);
                }
            }
        }
    }

Answer the question

In order to leave comments, you need to log in

Didn't find what you were looking for?

Ask your question

Ask a Question

731 491 924 answers to any question