鍍金池/ 問答/HTML/ vue-router.js里如何使用餓了么組件的彈框等的方法

vue-router.js里如何使用餓了么組件的彈框等的方法

methods: {

    open5() {
        this.$notify.info({
            title: '消息',
            message: '這是一條消息的提示消息'
        });
    }
}

這是餓了么UI的彈框方法，也是放到了單獨的一個pop.vue組件

import pop from '@/components/pop'

router.beforeEach((to, from, next) => {
if (to.path === '/login' || to.path === '/') {
    next()
} else {
    if (Cookies.get('uName')) {
        next()
    } else {
        next({path: '/login'})
        alert('請重新登錄')
        pop.methods.open5() //就是這里，使用報錯
    }
}

})
這是router.js的守衛(wèi) 我想在 重新登錄 這使用open5這個方法，但是報錯，this不對

回答
編輯回答
初心
  1. 如果只是想調(diào)用餓了么的彈框
單獨引用
單獨引入 Message：
import { Message } from 'element-ui';
  1. 如果調(diào)用彈框的同時還要用pop組件的this，暫時沒遇到這種需求，懶得想怎么實現(xiàn)。不過router.app是可以拿到配置了 router 的 Vue 根實例。但顯然這不是一個好方法。
2017年5月24日 18:27
編輯回答
安若晴

可以參考我的：


import ElementUI from 'element-ui'
import 'element-ui/lib/theme-chalk/index.css'
Vue.use(ElementUI)
import { Notification } from 'element-ui'

// 鉤子函數(shù)路由判斷
router.beforeEach((to, from, next) => {
  if (to.meta.requireAuth) {
    if (localStorage.token) {
      // console.log("已有個人信息!");
      next();
    } else {
      Notification.error({message: '請先登錄!', duration: 1000, position: 'bottom-right', showClose: false})
      next({
        path: '/login',
        // 跳轉(zhuǎn)到登錄頁
      })
    }
  }
  else {
    next();
  }
})
2017年2月21日 16:08
編輯回答
孤客
open5(){

}.bind(this);
2017年7月13日 06:32