在国内Vue盛行的今天,很多想转行入门前端的同学，以为掌握Vue开发，便能走上人生巅峰，在前端界有容身之所？所以不打基础直接上手Vue?遇到问题上交流群截图，当伸手党？ 作为前端开发的一份子，直接学Vue等于入门前端？告诉你，事实是不存在的。 掌握Vue是帮助前端开发人员敏捷开发的一种技能，Vue框架是一种高效解决通用业务场景的方案，在前端开发的发展长河中，他是目前受欢迎的，主流的方案之一。很多同学做出Vue项目后，都希望通过面试，来拿到一份前端offer，但也四处碰壁。 其实找一份前端工作，只会Vue是远远不够的，原生JS,移动端开发如果你不够熟练，是非常吃亏的。当然，如果有个好的UI大腿，切图你是可以忽略的。
物联网+时代，很多场景都是线上线下相互结合，导致移动端用户量激增。另一方面，以Angular,React,Vue为主的MVVM框架和NodeJS,ES6等前端新技术的出现和快速迭代，让前端得到前所未有的发展空间。
今天的前端，早已借助ES6和NodeJS实现模块化，系统化,前后端分离的开发模式也已经成熟。前端只需要关注接口数据，无需关注后端用什么语言实现。前端像适配器般角色，能够灵活对接后台，甚至，通过NodeJS,自己兼任后台角色，也就是全栈开发。因此，前端开发工程师的“钱”途，是十分乐观的，但这些技术实现，不是Vue一个框架能全部满足的。
既然JS能够前端，后端一手抓，作为想入门前端的同学，我们更应该专注于原生知识的学习，框架是学不完的，但底层的知识，思想是相通的，下面我们简单列出js的学习路线： 很多同学面试的过程中，被问到原生知识或底层原理，就答非所问。虽然使用Vue很久，但其中的响应式数据原理，Vue路由懒加载原理，Vue生命周期，这些理论知识却十分空白。更重要的是，面试官考察的，不仅是理论知识，还有你的编码习惯，拆分问题，解决问题的思维方式。我们要做的，就是夯实原生知识，设计模式，从前端走到后端，时刻关注前端动态，才能成为一名合格的前端开发工程师。
前置知识了解后，我们来快速入门Vue，对于不习惯阅读Vue官方文档的同学，可以继续往下读，我们还是推荐大家养成阅读文档的习惯，这样才能更快的掌握第一手资料。
我们蓝景也准备了Vue的电子书，把Vue里面必需掌握的知识再次提炼，帮助大家快速上手Vue，除了Vue，蓝景电子书还有其他有关前端方面的知识点，欢迎大家把蓝景电子书加入浏览器的收藏夹中，方便各位快速查阅（点我：http://mybook.bluej.cn/）。
学习一门新技术，我们从“hello world”开始下面教大家如何创建一个 Vue 实例，显示’hello world’
首先，在编辑器中，直接复制下面代码，用
第二步：创建一个 Vue 实例，显示’hello world’
这里涉及到了3个Vue的基础：1.将实例化的Vue对象挂载在id为app的容器中。
2.在data属性中声明响应式数据msg, 当这些属性的值发生改变时，视图将会产生“响应”。
3. 通过模板语法，使用“Mustache”语法 (双大括号) 的文本插值,把msg属性绑定到视图上
常用指令 通过”hello world”的例子，大家发现Vue的写法是非常贴合原生的，这也是“渐进式”框架的特点，推荐大家掌握原生js基础后，来学习Vue。下面我们列举Vue常用指令。
1.绑定数据 v-bind:(缩写:)动态地绑定一个或多个特性，或一个组件 prop 到表达式。
2.条件 v-if/v-showv-if指令用于条件性地渲染一块内容。这块内容只会在指令的表达式返回 truthy 值的时候被渲染。v-if="布尔值"v-if=“字符串”-隐式转换 v-if="true"v-if绑定条件如果为false，则以来占位v-show绑定条件如果为false，则添加style="display:none;"
3.循环 v-for="ele in elements "我们可以用 v-for 指令基于一个数组来渲染一个列表。v-for 指令需要使用 item in elements形式的特殊语法，其中 elements是源数据数组，而 ele 则是被迭代的数组元素的别名。结果:
通过学习上面的知识点，大家可以发现，有原生JS基础后再来学习Vue是不是倍感亲切，其实框架的api很多是贴近原生js的api，因此，我们强调夯实基础，以不变应万变的心态来接受新事物，这个就是学习前端正确的打开方式。
end
后台回复关键词▼回复“题库”即可做题回复“交流群”即可加入我们一起讨论回复“腾讯课堂”即可观看视频学习回复“项目案例”即可查看
B L U E · Jhttp://www.bluej.cn/newbluejsite/html/index.html扫描下方二维码关注我们期待每周与你相遇畅游代码世界
