使用vue開發項目時,如果習慣vue當前項目一些操作後相關數據的變化的log,可以安裝一個vue-devtools調試工具,如何安裝呢?請看下邊:
一:下載與安裝:
1.下載好vue-devtools壓縮包(crx類型的壓縮包),直接解壓到你自己選擇的本地目錄中:
2.打開谷歌瀏覽器,打開設置,並找到擴展程序:
3. 打開擴張程序按鈕後,需要先把右上角的開發者模式打開,默認是關閉狀態:
4.點擊''加載已解壓的擴展程序''按鈕,選擇剛才你下載並保存vue-devtools工具的目錄(我自己是安裝在D盤的vue-devtools目錄),點擊''選擇文件夾''按鈕即可:
自動回到瀏覽器後出現如下邊圖1紅色框,然後刷新瀏覽器,出現圖2紅色框的log,說明安裝成功了:
圖1
圖2
這樣我們就可以使用vue-devtools調試工具,查看vue項目數據變化的log了。
二:了解並使用
1.將本地的vue項目跑起來後,在瀏覽器打開你的項目,打開開發者模式,你會看見地址欄下邊多出了vue選項:
2.打開這個vue後,有以下頁面(相關按鈕的功能介紹如下圖):