迷你版Vue 學習如何造乙個Vue輪子

專案位址

其實vue1和vue2最大的區別就是vue2多了乙個虛擬dom，其他的區別都是很小的。所以理解了vue1的原始碼，就相當於理解了vue2，中間差了乙個虛擬dom的diff演算法

先來科普一下mvvm的概念及原理

mini-vuex

全域性方法

//

繼承minivue 產生乙個新的子類建構函式
minivue.extend
//在例項化過程完成後執行
minivue.nexttick
//註冊自定義指令
minivue.directive
//過濾器
minivue.filter 
//元件 包括slot props
minivue.component
//外掛程式
minivue.use
//混入
minivue.mixin

filters

components
mixin

vm.$watch

vm.$set
vm.$
delete
vm.$on
vm.$once
vm.$off
vm.$emit
vm.$nexttick

v-text

v-html
v-show
v-if
v-else
v-for
v-on
v-bind
v-model

計算屬性用法也和vue一樣

生命週期

init

created
beforecompiled
compiled
destroyed

建議從乙個vue例項化的過程開始 一直跟蹤這條主線 直到結尾為止(一定要打斷點 debugger 我打了100多個斷點才看懂主流程) 各種分枝暫時不要管 等把主線理解清楚了 細枝末節自然不在話下

在vue主線裡和資料雙向繫結有關的有以下幾個模組

實現乙個迷你版的vue

專案位址 其實vue1和vue2最大的區別就是vue2多了乙個虛擬dom，其他的區別都是很小的。所以理解了vue1的原始碼，就相當於理解了vue2，中間差了乙個虛擬dom的diff演算法 先來科普一下mvvm的概念及原理 mini vuex 全域性方法 繼承minivue 產生乙個新的子類建構函式 ...

手寫實現乙個迷你版的Tomcat

tomcat，這只3腳貓，大學的時候就認識了，直到現在工作中，也常會和它打交道。這是乙隻神奇的貓，今天讓我來抽象你，實現你！tomcat是非常流行的web server，它還是乙個滿足servlet規範的容器。那麼想一想，tomcat和我們的web應用是什麼關係？從感性上來說，我們一般需要把web應...

Vue學習筆記2 MvVM模式和第乙個Vue程式

vue官方文件 為什麼要使用mvvm mvvm模式和mvc模式一樣，主要目的是分離檢視 view 和模型 model 有幾大好處 view view是檢視層，也就是使用者介面。前端主要由html和css來構建，為了更方便地展現viewmode 或者model層的資料，已經產生了各種各樣的前後端模板語...