доступ к vue .prototype с уровня компонента

Question

Итак, в моем файле main.js у меня есть следующий набор:

Vue.prototype.api_url = 'http://localhost'

и в одном из моих компонентов: dashboard.vue

Я использую beforeRouteEnter

export default {
data() {
    return {
    }
},
beforeRouteEnter (to, from, next) {
    axios.post(this.api_url + '/dashboard')
}}}

Однако я получаю TypeError: Cannot read property 'api_url' of undefined

На другом компоненте, где я не использую beforeRouteEnter, я могу получить доступ к this.api_url без использования оператора импорта в компоненте уровень.

Есть мысли или предложения?

Answer 1

В общем, чтобы избежать конфликта, вам необходимо определить и использовать его со знаком доллара $:

Vue.prototype.$api_url = 'http://localhost'

и

axios.post(this.$api_url + '/dashboard')

UPDATE

Как объяснено здесь , внутри beforeRouteEnter у вас нет доступа к нему, потому что компонент еще не создан.

  beforeRouteEnter (to, from, next) {
    // called before the route that renders this component is confirmed.
    // does NOT have access to `this` component instance,
    // because it has not been created yet when this guard is called!   },

To доступ к этому, вы можете передать обратный вызов внутри функции next(), например:

    beforeRouteEnter (to, from, next) {
        next(that => {
            console.log(that.$api_url );
        })
    }

Обновление II

как для комментария Sphinx здесь,

вы можете импортировать Vue в свою панель управления. vue, а затем получить прямой доступ к Vue .prototype. $ Api_url

, и это тоже будет работать до того, как компонент фактически монтирует.

Надеюсь, это поможет!