2017-07-19 114 views
0

TL; DR:什麼是啓動應用程序之前做異步的東西的好方法? 如果我在創建/裝載根Vue實例之前等待異步內容完成,vue-devtools無法正常工作。如何在安裝根Vue實例之前獲取數據?

我是Vue.js的新手,我正在開發一個後臺應用程序,除非用戶登錄,否則什麼都不可訪問。除了登錄/註冊頁面當然。因此,在頁面加載

我做這樣的事情:

// Set up store and router ... 

router.beforeEach(function (to, from, next) { 
    /* redirect to auth if store.state.auth.isLogged is false */ 
} 

// Dispatch an action that send a request to the API to get the connected user 
// (or null if the user is not logged) 
store.dispatch('getAuth').then(user) { 
    // Mount the app one the request is done and the mutation for isLogged is done 
    new Vue({ 
     el: '#app', 
     router, 
     store, 
     // ... 
    }); 
} 

在我的index.html我有一個純HTML/CSS加載頁面,等待VUE應用裝載。

所以這工作正常,在加載時,應用程序檢查用戶是否登錄,一旦完成,它會重定向到auth頁面,如果需要的話。

我的問題主要是vue-devtools,看起來如果在頁面加載時未掛載根Vue實例,我無法從vue-devtools檢查組件,但vuex &事件檢查工作正常。再加上鉻上的擴展名圖標變灰(「Vue.js未檢測到」),而它的作品。

我做錯了什麼?或者它是devtools的問題?

回答

2

你在做什麼很好。 Vue開發工具右上角有一個刷新按鈕。點擊它,你的異步加載的Vue實例應該被檢測到。

+0

謝謝你的工作!我沒有注意到按鈕 – SebT

相關問題