Как я могу передавать от компонента к другому при перенаправлении в VueJS? - PullRequest
0 голосов
/ 10 сентября 2018

В настоящее время я работаю над формой входа в систему, которая будет перенаправлять пользователя в «/ admin» после его подключения. Однако, если он попытается набрать "/ admin", пока он не зарегистрирован, он будет перенаправлен на "/login".

То, что я хотел бы, это иметь возможность отображать сообщение о том, почему он здесь (что-то вроде «Вы должны быть подключены, чтобы продолжить»). Я также хотел бы сделать то же самое при вводе «/ login», когда он подключен (в этом случае он будет перенаправлен с сообщением «вы уже вошли в систему»)

Я пытался передавать данные разными способами, но каким-то образом я не могу получить их, и я почти уверен, что это потому, что я делаю это неправильно.

Это макет vue "/ admin", который обеспечивает постоянную регистрацию пользователя.

beforeCreate () {
    this.$axios.get('/logged_in')
      .then(response => {
        if (!response.data) { // either returns true or false
          this.$router.replace({ name: 'login', params: { error: 'not_logged' } })
        }
      })
  }

Это форма входа в систему, и "как" я пытался получить содержание параметров

created () {
    this.$axios.get('/logged_in')
      .then(response => {
        if (response.data) {
          this.$router.replace({ name: 'admin', params: { error: 'already_loggedin' } })
        }
      })
    console.log(this.$router.params)
  }
}

watch: {
  $route (to, from) {
    console.log(to)
    console.log(from)
  }
}

Из 3 console.logs в консоли отображается только первый (this.$router.params), с undefined.

Что мне делать?

Заранее спасибо

1 Ответ

0 голосов
/ 10 сентября 2018

Из 3 консольных журналов отображается только первый (this. $ Router.params)

Это наиболее вероятно, потому что ваш компонент был размонтирован после изменения маршрута. Вот почему наблюдатели больше не работают.

О первом файле console.log, если вы перенаправлены сюда с первого компонента с помощью:

this.$router.replace({ name: 'login', params: { error: 'not_logged' } })

Тогда я думаю, что $ route.params должен иметь этот параметр (не $ router.params).

Также вы можете объявить реквизиты для компонента и передать их из определения маршрута, как описано здесь: https://router.vuejs.org/guide/essentials/passing-props.html#boolean-mode

Примечание:

Если для параметра props установлено значение true, параметры route.params будут установлены как параметры props.

...