В Vue как мне установить ссылку на компонент, содержащий пользовательские данные c? - PullRequest
Новая
       4

В Vue как мне установить ссылку на компонент, содержащий пользовательские данные c?

0 голосов
/ 06 мая 2020

Я прошел курс Udemy по созданию приложения Vue с помощью Firebase. Приложение состоит из страницы регистрации и входа в систему. Как только вы войдете в систему, вы попадете на карту Google, которая показывает ваше местоположение. Если вы нажмете на маркер местоположения, вы попадете на страницу профиля, содержащую вашу личную информацию.

Дело в том, что я не хочу получать доступ к этой информации с маркера. Я хочу получить к нему доступ по обычной ссылке на панели навигации. Можете ли вы показать мне, что мне нужно изменить, чтобы это стало возможным?

Метод, используемый для маркера, выглядит следующим образом 

    methods: {
        renderMap(){
            const map = new google.maps.Map(document.getElementById('map'), {
                center: { lat: this.lat , lng: this.lng },
                zoom: 6,
                maxZoom: 15,
                minZoom: 3,
                streetViewControl: false
            })
            db.collection('users').get().then(users => {
                users.docs.forEach(doc => {
                    let data = doc.data()
                    if(data.geolocation){
                        let marker = new google.maps.Marker({
                            position: {
                            lat: data.geolocation.lat,
                            lng: data.geolocation.lng
                            },
                            map
                        })
                        marker.addListener('click', () => {
                            this.$router.push({name: 'ViewProfile', params: { id: doc.id }})
                        })
                    }
                })
            })
        }
    }

На моей панели навигации я написал такую ​​ссылку (которая не работает): 

<li v-if="!user"><router-link :to="{ name: 'ViewProfile' }">Login</router-link></li>

Пробовал (но тоже не сработало): 

 <li v-if="user"><router-link :to="{ name: 'ViewProfile',params:{ id: doc.id }}">Profile</router-link></li>
...