vue學習的筆記補充

2022-05-16 08:33:30 字數 2151 閱讀 9761

//

vue-router中可以使用

routes:[

]//這種寫法可以讓componet 後面跟乙個匿名函式裡面跟著元件的路徑。

//v-cloak 防止表示式閃爍

//v-pre 不編譯這個標籤

//immediate:true 在使用handler 函式時 可以在初始化時進行監聽.

watch:,

immediate:

true, //

監聽初始化的資料

deep:true

//深度監聽資料}}

//凡是例項上的東西都可以進行監聽

//許可權路由

//路由元件傳值

//計算屬性也擁有getters 和setters 預設寫的是getter,設定setter

//執行可以當此計算屬性資料更改的時候去做其他的一些事情.相當於watch這個計算屬性

computed:,

set:function(val)

}}//

過濾器//

vue 中可以設定filter(過濾器)來實現資料格式化,雙花括號插值和v-bind表示式中使用

//呼叫過濾器 } } 可以有多個過濾器進行過濾

vue.filter(

'money

',(value)=>)

//mixin 便於混合 後期維護時候進行操作

let obj =

}let vm = new

vue(

})//

虛擬dom的核心思想:對複雜的文件dom結構,提供一種方便的工具,進行最小化的dom操作

//這句話,也許過於抽象,卻基於概況了虛擬dom的設計思想

//1,提供了一種方便的工具,使得開發效率得到了保證

//2,保證最小化的dom操作,使得執行效率得到保證

//也就是說,虛擬dom的框架/工具都是這麼做的:

//1:根據現有的真實的dom來生成乙個完整的虛擬dom樹結構

//2:當資料變化,或者說頁面需要重新渲染時候,會重新生成乙個新的完整的虛擬dom

//3:拿新的虛擬dom來和舊的虛擬dom做對比(使用diff演算法),.得到需要更新的地方之後,更新內容

//元件化開發:

//優點:**復用,便於維護

//劃分元件的原則:具有大量的布局結構的,或者是獨立的邏輯的,都應該分成元件.

//元件應該擁有的特性:可組合,可重用,可測試,可維護

//元件可以用script的標籤來書寫比如:vue.component(

'my-component',)

//我們可以為元件的 prop 指定驗證規則。如果傳入的資料不符合要求,vue 會發出警告。這對於開發給他人使用的元件非常有用

//驗證主要分為:型別驗證、必傳驗證、預設值設定、自定義驗證

props:,

//預設資料

bool

: },

//自定義型別

nums:

}}//

slot 匿名插槽 具名插槽 作用域插槽

//匿名插槽

//為了讓h1顯示出來

let com =

//具名插槽 根據名字來匹配

let com =

//元件傳參可以使用props 路由 非父子元件可以使用props 路由 還有空元件也可以傳參

//從a元件傳給b元件

//a元件內容

aaa

'send

'>send

//在空元件種傳參 空元件內容:

import vue from

'vue';

export

default

newvue();

//b元件

import bus from

"空元件路徑

"export

default

) }}//

命名路由

//router-link 寫在本頁面"/

">點我顯示多個元件routes:[

}]//

router-view 顯示本頁面的路由 顯示當前元件的子元件 如果是預設路由的話 直接寫router-view 顯示當前的元件

"right

">

//right是要顯示元件的名字

Vue學習補充篇

即可以在vue外部定義變數,在建立vue例項時可以直接使用。2.1箭頭函式 一般在需要傳遞函式作為引數時使用 2.2filter函式 對陣列的每個元素進行過濾 const nums 10,20,30,40 let new nums new nums nums.filter function n co...

vue學習筆記(4)之基礎語法補充

2 v model雙向繫結radio 3 v model繫結checkbox 4 v model繫結select 5 值繫結 6 修飾符 前面我們學的是在html標籤中使用mustache語法實現資料的動態顯示,利用vue的v bind語法實現屬性的動態繫結,通過v on實現與使用者的動態互動等等。...

jquery學習筆記補充

1,工具函式 全域性函式 字串處理 trim 物件和陣列操作 each 遍歷陣列 var arr 1,2,3,4 each arr,functon index,value each window,function name,value each ajax function name,value 2....