简单的Vue入门小案例--看了应该会懂的

1、Vue简介

vue是现在很火的一个前端MVVM框架,其实(MVVM)=(M+V+VM),它以数据驱动和组件化的思想构建的,与angular和react并称前端三剑客。相比angular和react,vue更加轻巧、高性能、也很容易上手,请移步官网介绍。在下简单粗暴的理解就是:用vue开发的时候,就是操作数据,然后vue就会处理,以数据驱动去改变DOM。它的底层是使用的diff算法,有兴趣的同学可以去详细了解一下!

2、简单入门例子(Vscode+vue-cli脚手架+webpack打包构建工具) 

  • 2.1安装脚手架 

首先进入项目文件夹里面 ,输入命令cnpm install -g vue-cli

  • 2.2 直接使用webpack暴力构建吧 

 输入命令,vue init webpack '项目名称',在这里要是你在Vscode的控制台输入有可能会报错,所以还请从电脑进入文件夹中输入这个命令吧。

  • 2.3构建完成 (项目目录)

 简单的Vue入门小案例--看了应该会懂的

  • 2.4自己写一个vue文件尝试运行访问 

 简单的Vue入门小案例--看了应该会懂的

简单的Vue入门小案例--看了应该会懂的

简单的Vue入门小案例--看了应该会懂的

3、运行结果 

 简单的Vue入门小案例--看了应该会懂的

简单的Vue入门小案例--看了应该会懂的