vue是一个前端框架,使用MVVM(Model-View-ViewModel的简写)模式。看过官网这个介绍的心得就是看不懂。没事我举个通俗可能易懂的例子,你们随意感受一下。

当皮影动作改变时,幕后的人动作也在做对应的改变。反过来也一样,当操作人动作改变时,皮影也在做相应的动作。

(1)李古拉雷有一个孙悟空的皮影,他的好基友想玩一下,李古拉雷直接把这个皮影给他就好,至于能玩出什么花样,就看他的能力了。

(2)玩的时间长了,李古拉雷对当前这个孙悟空的颜色有点厌倦,想换个色儿,比如绿色。他拿起笔就给孙悟空的帽子该成了绿色。改过色后的孙悟空耍起金箍棒照样虎虎生威,虽然动作一样,好像更好看了。

(1)(2)用我们行业黑话来讲就是低耦合,皮影和玩皮影的人是相互独立没太大关系,李古拉雷的皮影换个人照样玩,皮影换个颜色加点装饰,孙悟空还照应耍金箍棒,不太会去耍太极(这取决于李古拉雷有没有学会太极的动作)

(3)有一天李古拉雷真的学会了太极的动作,这段皮影舞孙悟空耍的也是有模有样。

(4)时间一长,孙悟空这个皮影玩够了,李古拉雷就和他的好基友商量,想做一个猪八戒玩,他们分工合作,李古拉雷负责练习动作,基友负责制作皮影,分工明确互不影响。

在这个教程发布之际,vue的最新版本是2.6,2.6相较于2.0并没有特别大的升级,2.x系列都可以向后兼容。同时本系列教程目的是让初识vue的朋友能快速又高效的上手开发,不会被那些官网那些原理线下的组件库已经经过时间和程序员的考验,运行稳定,种类丰富。总而言之vue2.0是个不错的选择,接下来的教程如果不做特殊说明,vue是指vue2.0版本。

一种是直接引入CDN链接(引入方式同jQuery)或者下载到本地环境,在程序中引入文件,在浏览器中直接运行。

二种是在node.js下运行 ,在命令行工具中用vue-cli命令集进行操做(起个服务、创建项目、打包编译),程序按照vue的模板语法完成代码编写。

2.安装完成后,在E盘新建一个“workspace”的文件夹,进入建好的这个文件夹,按着“shift”键同时点击鼠标右键,选择“在此处打开命令窗口”。(文件夹路径可以建立在任意目录,尽量不要以中文命名)。

3.把 npm 改成 cnpm ,因为npm命令安装源不在境内,安装比较慢,而cnpm使用的是淘宝镜像,网速有保障,装起组件来丝丝顺滑,那叫流畅。

软件重启后生效,如果没有生效,还是显示英文的话,打开下面这个链接,安装中文语言包

至此,node.js、和开发软件就初步安装完成了。下一节我们正式进入vue2.0的秘密花园。

上面不是安装过环境了,咋还安装啊?对你没有看错,不过这里安装的环境是项目运行环境。上面安装的是开发环境,有本质的区别。运行环境安装后以后,就是鸟枪换炮,不用再一个一个苦哈哈新建目录和.html、.css、.js文件,只要运行几条命令,项目目录和文件会自动安装完成。这个感觉倍儿爽。学会了这招,你就成为了前端圈最靓的仔。

先找一个工作空间(比如我的是在 E 盘 WorkSpace),新建一个文件夹“v2.0-tutorial”,进入“v2.0-tutorial”,同时 按住 “shift”+鼠标右键 ,点击“在此处打开命令窗口”

vue-cli 是vue的命令行界面,安装成功以后可以使用vue下的命令进行项目初始化等一些操作。

打开v2.0-tutorial文件夹,看是否多了一个 demo01文件夹,这个就是你的第一个项目

src/components:组件文件。

发表回复

您的电子邮箱地址不会被公开。 必填项已用 * 标注