學習vue 20天，我寫了點東西

往昔

最初團隊裏使用Angularjs進行開發，剛開始還好，到了項目後期愈加感受Angularjs過重了，以致於後來重構項目時，毅然放棄Angularjs，投入了Vue的懷抱。除了組建團隊時，是我搭建了基於Angularjs的前端開發框架，以後都是由前端小組開發。前段時間，因爲公司層面的緣由，整個團隊解散，不得已我又要寫前端程序了。

雖然前期Angularjs的開發框架是我搭建的，但對前端來講我也是半路出家了。那個時候也不知道模塊開發，更分不清commonJS、AMD、CMD，知道有個requirejs，就研究requirejs，研究了幾天忽然冒出一個叫grunt的構建工具，因而又研究grunt，一樣研究了幾天又竄出來個叫gulp的東西，丟了grunt又研究起gulp來，這真有點像小時候聽的猴子摘桃的故事，看見好的就丟掉了以前的，最後什麼都沒獲得。gulp搞的差很少了，不知又從哪裏看到了一個叫webpack的東西，個人天哪，當時的感受就是前端的東西太多東西了，那個時候是2015年下。

當下

再一次寫前端程序已經到了2017年了，除了維護以前Angularjs的代碼，還有新的項目，我選擇了Vue 2.0。

學習一門新的技術是須要花費很多代價的，時間不說，動力也是不可或缺的。時間我有，動力也足，那就是半個月作完一個小的管理後臺，API已經在上個周加班加點搞定了。半個月要學一門新的技術，還要把功能作完，自我感受應該是沒問題的，畢竟Vue真的是一個很是簡單的框架。

我簡單列了一個簡單的學習計劃，不用太詳細，由於計劃老是趕不上變化，事實也確實如此，最重要的仍是動手、實踐、執行。

1. 第1天看完Vue的官方文檔，大體瞭解一下Vue都有哪些功能，作到心中有數；
2. 第2天看完vue-router和vuex，瞭解路由和狀態管理，藉助Shopping Cart的例子快速理解，state、getters、actions、mutations、commit、dispatch、mapGetters、mapActions；
3. 第3天花了一點時間看axios，由於官方在Vue2.0中推薦axios;而後開始搭建項目結構，選擇基於webpack的構建模板（不要問我怎麼知道的，那麼多優秀的開源demo）；
4. 第4天作了登陸的功能，將vue付諸實踐。剛開始寫代碼比較生疏，只好一邊查文檔一邊寫；
5. 第5天作登陸後的總體佈局，結合metronic；寫最簡單功能的列表時，沒找到合適的table插件，決定本身寫一個；
6. 第6天開始寫本身的table插件，起了名字cxlt-vue2-table，放在了github上，先後花了4天，如今還不完善。寫table插件的過程比較深刻的瞭解了vue，谷歌了無數次，也無數次了文檔；
7. ...
8. 還寫了一個自動完成的插件cxlt-vue2-autocomplete和彈出提示cxlt-vue2-toastr的插件

最後按時完成了這個小項目，一隻腳也算踏進了vue的大門，爭取早日將另外一隻腳也踏進來。

將來

當下即將來，將來在當下

東西

上文提到的插件我都放在了github上，table和autocomplete還不是太完善，文檔也沒有寫，週日的時候我把toastr的doc和example寫了一下，感興趣的能夠前往看一下

項目地址：https://github.com/chengxulvtu/cxlt-vue2-toastr

Demo地址:https://chengxulvtu.github.io/toastr/index.html

Demo截圖