vue基本知識點


Vue
尤雨溪

漸進式的JAVAscript框架

MVVM框架
M:model層 數據的增刪改查
V:view層 視圖 類似與HTML一樣的模板
VM:viewModel model和view的一個映射層


優點:
數據驅動視圖


回流和重繪
簡單的來說頁面的排版布局發生了改變就是回流
簡單來說對一個元素進行樣式操作不會導致頁面布局發生改變重繪

回流一定會發生重繪
重繪不一定發生回流

vue常用的指令
v-text {{}}
v-html
v-bind :
v-on @ .stop .prev .enter .keyCode值 $event
v-model form表單 .number
Object.defineProperty
Proxy
v-for

 


v-show
v-if
區別:
前者操作元素的display屬性 初次渲染的開銷較大
后者操作元素的創建和銷毀 開銷較大

 

使用場景:
v-else-if
v-else
v-pre
v-cloak
v-once
v-slot 插槽


自定義指令
全局注冊
Vue.directive()
局部注冊
VUE({

})

過濾器
Vue.filter()

組件
Vue.component()

watch
屬性監聽
基於Vue的依賴,當依賴的屬性發生了改變的時候,那么就會自動觸發相對應的方法進行數據的處理
如果監聽對象的時候只會監聽對的引用地址是否發生了改變 具體的值是不會進行監聽的
如果需要監聽對象值的變化 handler函數 deep:true
無法監聽數據(特殊情況)的變化 this.arr[0] = 200; this.arr.length = 0
在監聽的函數中會接收到2個值 一個新值和一個舊值
$set() 給一個響應式對應添加一個響應式屬性

 

特點:
一個數據影響多個數據

computed
屬性計算
基於Vue的依賴,當依賴的屬性發生了改變的時候,那么就會自動觸發相對應的方法進行數據的處理
數據的緩存

特點
一個數據受多個數據的影響

 

生命周期
beforeCreate
created
beforeMount
mounted
beforeUpdate
updated
beforeDestroy
destroyed
activated 活躍狀態
deactivated 緩存狀態


動態組件
通過同一個掛載點進行動態切換組件的變化
<component></coponent> is

<keep-alive></keep-alive> (***)

屬性:
include
exclude
max


Vue動畫
當前的元素必須遵循2個特點
1、必須經歷顯示隱藏
2、需要執行動畫的元素 外層必須加一個<tranisition></tranisition>


name:動畫的名稱

name-enter
name-enter-active
name-enter-to

name-leave
name-leave-active
name-leave-to


<tranisition
enter-class
enter-active-class
enter-to-class
。。。
></tranisition>

 

組件傳值
父傳子
自定義屬性
props:[] {}
type default required


子傳父
通過自定義方法 觸發通過this.$emit


通過插槽作用域

非父子
公共的vue實例對象
EventBus
手動封裝$on $emit $off 事件訂閱
Vuex

為了使組件更加的靈活


data為什么在組件中是一個函數而不是一個對象?

什么是單項數據流?


插槽
slot


默認名字是default

如果需要命令的時候 v-slot:名稱


作用域插槽:
v-slot:名稱 = "接收的值"
<Banner>
<template v-slot>
<p>111</p>
</template>
</Banner>


vue實例身上的方法
$mount()
$destroy()
$foreUpdate

$on
$emit
$off
$once


1、什么叫回流和重繪
2、虛擬DOM (虛擬DOM就是真實的JS對象,操作內存中的JS對象比操作真實的DOM速度要快)
3、模塊化
4、虛擬DOM的key值有什么作用
5、Object.defineProperty
6、單頁面開發與多頁面開發的優缺點

 

博客
深入響應式原理

單文件組件?

 

查漏補缺
<keep-alive></keep-alive>
實例身上的方法
$extend
$mixin
路由
Vuex
axios
跨域
移動端


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM