vue.js2.0 新手开发_VueJs2.0建议学习路线
最近VueJs確實火了一把,自從Vue2.0發布后,Vue就成了前端領域的熱門話題,github也突破了三萬的star,那么對于新手來說,如何高效快速的學習Vue2.0呢。
既然大家會看這篇文章,那么肯定是vue的學習者了,或是遇到的瓶頸,或者剛剛開始學,不知道如何快速起步,本篇文章將帶領大家在最短的時間內構件一個學習Vue的學習路線
Vuejs的作者尤雨溪尤大也寫過一篇關于新手學習vue路徑的文章新手向:Vue 2.0 的建議學習順序
百度vuejs搜索的是vue1的文檔,推薦大家直接上2.0,畢竟1和2還是有區別的。vue2.0文檔地址Vue2.0
Vue基礎
對于沒有接觸過es6和webpack的童鞋來說,不建議直接用官方的腳手架vue-cli構件項目。
先按文檔順序最少學習完組件那一章。直接在html文件中引入vue.js開始學習,了解vue的基礎指令和語法。
vue的生命周期很重要,了解這點以后可以免去很多問題。
學完這些可以做一些練手的小項目,比如萬年不變的todolist。。。
現在可以開始學習使用vue-cli構件項目了,學習組件化之前,推薦先看一下es6關于模塊的介紹。阮一峰《ECMAScript6》 Module
光會這些還是不夠的,還得會一些npm基礎,知道如何用git-bash來安裝依賴,會一些常用的命令。這方面的知識可以參閱npm入門文檔
看完這些就可以試著將之前的寫的demo用搭建的vue-cli來實現。附上我寫的一個入門小demovue-demo-search
多看看組件那里,看看如何在vue-cli中怎么實現組件化,說白了,vue玩的就是組件。
到這里vue基礎篇就結束了。你還可以有條件的參閱剩下的官方文檔里面的進階篇,如果時間有限,就直接進入vue-router
Vue-router
和之前一樣,推薦直接用html+js過一遍文檔
對路由導航鉤子得好好看一看。
看完文檔就可以上手vue-cli,一般新手在這幾天都會死活跑不出來。
最直接的方法就是去github上搜一些關于vue-router2.0的demo,看如何構件路由,如何構件項目目錄。
我這里有一個傳送門
如果能跑出來,就可以做一些小項目了,比如寫一個知乎日報啊
,這些demo在github上很多。
可以結合一些組件庫寫demo,這樣可以更加了解組件化。比如餓了么團隊的Element、mint-ui
Vuex
什么是vuex?
Vuex 是一個專門為 Vue.js 應用設計的?狀態管理模型 + 庫。它為應用內的所有組件提供集中式存儲服務,其中的規則確保狀態只能按預期方式變更。說白了就是控制應用的一些全局狀態。狀態改變了,對應的視圖也會改變。
在學習Vuex時,會有一些ES6特性,當遇到這些時,最好不要一帶而過,去好好看一看這些es6特性。
比如在學習Action時可以看看ES6新增的Promise和參數解構。
實踐的方法一樣是先看別人別人寫的代碼,比如官方的購物車實例的應用結構。
把之前寫的demo優化一下,有些地方可以用用vuex。
vuex主要是用來對不同組件間進行通信,它構建了一個Vue實例的全局數據與方法,這些數據與方法可以在該Vue實例的所有組件中getter與setter。
到此,恭喜你已經成功入門Vue了。還學會了一點ES6,,附帶一點Webpack
,可以開始寫一些小作品了,比如寫個播放器啊,寫個高級點的todoList等等,附上我寫的一個仿照酷狗webapp的例子吧,傳送門
與50位技術專家面對面20年技術見證,附贈技術全景圖總結
以上是生活随笔為你收集整理的vue.js2.0 新手开发_VueJs2.0建议学习路线的全部內容,希望文章能夠幫你解決所遇到的問題。
- 上一篇: python网络通信协议_Python网
- 下一篇: html5倒计时秒杀怎么做,vue 设