博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
VueJs2.0建议学习路线
阅读量:5265 次
发布时间:2019-06-14

本文共 1433 字,大约阅读时间需要 4 分钟。

最近VueJs确实火了一把,自从Vue2.0发布后,Vue就成了前端领域的热门话题,github也突破了三万的star,那么对于新手来说,如何高效快速的学习Vue2.0呢。

既然大家会看这篇文章,那么肯定是vue的学习者了,或是遇到的瓶颈,或者刚刚开始学,不知道如何快速起步,本篇文章将带领大家在最短的时间内构件一个学习Vue的学习路线

Vuejs的作者尤雨溪尤大也写过一篇关于新手学习vue路径的文章

百度vuejs搜索的是vue1的文档,推荐大家直接上2.0,毕竟1和2还是有区别的。vue2.0文档地址

 

Vue基础

  1. 对于没有接触过es6和webpack的童鞋来说,不建议直接用官方的脚手架vue-cli构件项目。
  2. 先按文档顺序最少学习完组件那一章。直接在html文件中引入vue.js开始学习,了解vue的基础指令和语法。
  3. vue的生命周期很重要,了解这点以后可以免去很多问题。
  4. 学完这些可以做一些练手的小项目,比如万年不变的todolist。。。
  5. 现在可以开始学习使用vue-cli构件项目了,学习组件化之前,推荐先看一下es6关于模块的介绍。
  6. 光会这些还是不够的,还得会一些npm基础,知道如何用git-bash来安装依赖,会一些常用的命令。这方面的知识可以参阅
  7. 看完这些就可以试着将之前的写的demo用搭建的vue-cli来实现。附上我写的一个入门小demo
  8. 多看看组件那里,看看如何在vue-cli中怎么实现组件化,说白了,vue玩的就是组件。
  9. 到这里vue基础篇就结束了。你还可以有条件的参阅剩下的官方文档里面的进阶篇,如果时间有限,就直接进入vue-router
 
 

Vue-router

  1. 和之前一样,推荐直接用html+js过一遍文档
  2. 对路由导航钩子得好好看一看。
  3. 看完文档就可以上手vue-cli,一般新手在这几天都会死活跑不出来。偷笑
  4. 最直接的方法就是去github上搜一些关于vue-router2.0的demo,看如何构件路由,如何构件项目目录。
  5. 我这里有一个
  6. 如果能跑出来,就可以做一些小项目了,比如写一个知乎日报啊偷笑,这些demo在github上很多。
  7. 可以结合一些组件库写demo,这样可以更加了解组件化。比如饿了么团队的、
 
 

Vuex

什么是vuex?
Vuex 是一个专门为 Vue.js 应用设计的 状态管理模型 + 库。它为应用内的所有组件提供集中式存储服务,其中的规则确保状态只能按预期方式变更。说白了就是控制应用的一些全局状态。状态改变了,对应的视图也会改变。
 
  1. 在学习Vuex时,会有一些ES6特性,当遇到这些时,最好不要一带而过,去好好看一看这些es6特性。
  2. 比如在学习Action时可以看看ES6新增的Promise和参数解构。
  3. 实践的方法一样是先看别人别人写的代码,比如官方的购物车实例的应用结构。
  4. 把之前写的demo优化一下,有些地方可以用用vuex。
  5. vuex主要是用来对不同组件间进行通信,它构建了一个Vue实例的全局数据与方法,这些数据与方法可以在该Vue实例的所有组件中getter与setter。
   
 
到此,恭喜你已经成功入门Vue了。还学会了一点ES6,,附带一点Webpack
偷笑,可以开始写一些小作品了,比如写个播放器啊,写个高级点的todoList等等,附上我写的一个仿照酷狗webapp的例子吧,

 

转载于:https://www.cnblogs.com/smartXiang/p/6051086.html

你可能感兴趣的文章
hdu1565 用搜索代替枚举找可能状态或者轮廓线解(较优),参考poj2411
查看>>
bzoj3224 splay板子
查看>>
程序存储问题
查看>>
Mac版OBS设置详解
查看>>
优雅地书写回调——Promise
查看>>
android主流开源库
查看>>
AX 2009 Grid控件下多选行
查看>>
PHP的配置
查看>>
Struts框架----进度1
查看>>
Round B APAC Test 2017
查看>>
MySQL 字符编码问题详细解释
查看>>
Ubuntu下面安装eclipse for c++
查看>>
让IE浏览器支持CSS3圆角属性的方法
查看>>
巡风源码阅读与分析---nascan.py
查看>>
LiveBinding应用 dataBind 数据绑定
查看>>
Linux重定向: > 和 &> 区别
查看>>
nginx修改内核参数
查看>>
C 筛选法找素数
查看>>
TCP为什么需要3次握手与4次挥手(转载)
查看>>
IOC容器
查看>>