vue element admin使用記錄

2021-10-08 13:31:30 字數 1584 閱讀 8008

再 man.js同目錄下的permission.js中設定路由守衛和登陸判斷。

whitelist中設定路由白名單。不受非登陸狀態下攔截配置

使用js-cookie模組來判斷使用者是否登陸狀態。是否快取有使用者登陸資訊。

登陸狀態判斷邏輯為,如果獲取到後端設定的cookie欄位,則判斷是否有使用者資訊,有則進入使用者請求的路由;否則重定向到登陸頁面,並刪除本地cookie欄位,讓使用者重新登陸

在左側選單只有乙個子選單的情況下顯示根路由:

在根路由下設定

alwaysshow: true

v-html用來原樣輸出html內容。例如富文字編輯器中的內容

v-bind來繫結屬性例如:bind=

模板語法中允許一些簡單的js表示式,表示式必須簡單並且有返回值

vue中的指令 v-once v-html v-if v-else v-bind v-on ,請注意他們的一些縮寫。 v-bind

可以縮寫為: , v-on可以縮寫為@。 v-show 控制的是元素的display

vue中的指令。 vue.directive

定義directive的名稱。

呼叫directive方法

傳遞物件引數

注意directive內部的時機執行函式、例如:bind、update等方法。

自定義指令的使用。建立為自定義指令檔案後再需要使用的地方進行引入, 用v-自定義指令名稱,在設定自定義指令生效的作用節點。

vue的.修飾符號。例如用來進行阻止事件冒泡、簡單監聽鍵盤事件等。@keyup.13=

修飾符分為事件修飾符和按鍵修飾符

在vue的元件通訊props中,一般情況下,資料都是單向的,子元件不會更改父元件的值,那麼vue提供.sync作為雙向傳遞的關鍵字,實現了父元件的變動會傳遞給子元件,而子元件的carts改變時,通過事件機制,修改父元件的cart。完成了子元件carts和父元件cart的雙向對映。

這種傳到子元件上filterableattr是boolean型別

ref=

"sub"

:filterableattr

="false"

>

sub>

這種傳到子元件上filterableattr是string型別

ref=

"sub"

filterableattr

="false"

>

sub>

vue中的計算屬性 computed

vueclass傳引數組和物件。動態展示類名

vue事件中獲取原始event物件。事件方法中傳特殊變數$event

自定義表單校驗 ,rules中新增validator屬性,並傳入自定義校驗方法名。

this.$set(name,vale)vue中動態往物件中新增屬性和值

通過provide和inject傳遞狀態時,inject也可以和prop一樣寫為物件形式。並設定乙個預設值。

搭建vue element admin環境

1.安裝git 直接在資料夾下輸入cmd回車 轉殖專案 2 修改路徑 在cmd視窗執行以下兩條命令 npm config set prefix c node node global npm config set cache c node node cache 進入專案目錄 cd vue elemen...

後台模板 vue element admin

而vue element admin是基於element ui 的一套後台管理系統整合方案。功能 功能 解壓壓縮包 進入目錄 cd vue element admin master 安裝依賴 npm install 啟動。執行後,瀏覽器自動彈出並訪問http localhost 9527 npm r...

vue element admin學習過程

最近提了新的需求,讓我去看一下vue element admin,由於之前並沒有接觸過vue,所以看起來有點雲裡霧裡的,看的都懂,寫起來又是另一回事了。這邊記錄下學習過程。vue是中國人開發的,官方文件也好理解,所以看的比較多。學習前,先問了大佬需要掌握的一些入門知識。學習過程應該是vue基礎知識 ...