【Vue.js 牛刀小试】：第一章 - 一些基础概念

系列目录地址

• 1、基础知识概览
  • 第一章 - 一些基础概念（posted at 2018-10-31）

前言

        Vue、React、Angular，当今前端界的三驾马车，做为传统的后端程序员，前端不再是咱们想的那种切切图就能够了，第一次接触的话，先了解了解一些基础的概念。

        仓储地址：Chapter01-Rookie Concept

干货合集

        一、 Vue.js是什么?

        Vue (读音 /vjuː/，相似于 view) 是一套用于构建用户界面的渐进式框架，只关注于视图层。在Vue的官网中咱们能够看见，对于渐进式框架这个词，做者是加粗表示的，按照做者的设计，Vue包含了现代前端框架所必须的内容，可是你并不须要一开始就把全部的东西都用上，这些都是可选的。

        对于Vue的解释，推荐简书上的一篇文章，文章地址：一句话理解Vue核心内容

        二、 使用Vue.js后与传统的前端开发模式有何不一样?

        在传统的前端开发中，为了完成某个任务，咱们须要使用 JS/Jquery 获取到元素的DOM元素，随后对获取到的DOM元素进行操做。而当咱们使用Vue进行前端开发后，对于DOM的全部操做所有交由Vue来处理，咱们只须要关注于业务代码的实现就能够了。

        三、 如何使用Vue.js?

        3.一、使用 script 标签引用Vue.js（这里能够在Vue的官网上下载好js文件后使用标签引入，也可使用cdn的形式引入）

<script src="https://cdn.jsdelivr.net/npm/vue@2.5.17/dist/vue.js"></script>
复制代码

        3.二、使用 Vue-cli 构建单页应用（须要先在电脑中安装好node.js环境才可以使用）

//一、全局安装Vue-Cli
npm install -g vue-cli
//二、进入建立项目目录下
//三、建立使用webpack模板的Vue单页应用，Enter后根据提示完成项目的建立
vue init webpack projectname
//四、进入项目目录下
//五、下载项目引用的包
npm install
//六、运行项目
npm run dev
复制代码

        PS：这里使用的是 vue-cli 的 2.x 版本，在最新的 vue-cli 3.x 版本中，包名已经发生了改变，你须要卸载原有的包以后从新安装 vue-cli 才能够，同时也可使用页面的形式配置项目了。

//一、卸载原有的 vue-cli 版本
npm uninstall vue-cli -g
//二、安装新版本 vue-cli
npm install -g @vue/cli
//三、建立项目
vue create projectname
//三、使用页面建立
vue ui
复制代码

        四、 MVC与MVVM

        4.一、MVC（Model-View-Controller）：是一种表现模式（UI / Presentation Pattern），它将软件的UI部分的设计拆分红三个主要单元，分别是Model、View和Controller。

        MVC核心是控制器，它负责处理浏览器传送过来的全部请求，并决定要将什么内容响应给浏览器。

        Model：模型，用于存储数据的组件

        View：视图，根据Model数据进行内容展现的组件

        Controller：控制器，接受并处理用户指令，并返回内容

        4.二、MVVM（Model-View-ViewModel）：MVVM的核心是ViewModel，它提供了对于Model和ViewModel的双向数据绑定，经过ViewModel链接View和Model,确保视图与数据的一致性,而这个过程是框架自动完成的,无需手动干预。

        图片版权说明：由 Ugaya40 - 本身的做品， CC BY-SA 3.0， 连接

总结

        本篇文章主要学习了一些 vue 涉及到的一些概念，在后面的学习中，也会逐渐往本篇文章中里面添加用到的知识，文章开始处提供仓储地址里会将涉及到的知识点的汇总成一个markdown文档，但愿多多关注啊。

占坑

        做者：墨墨墨墨小宇
        我的简介：96年生人，出生于安徽某四线城市，毕业于Top 10000000 院校。.NET程序员，枪手死忠，喵星人。于2016年12月开始.NET程序员生涯，微软.NET技术的坚决坚持者，立志成为云养猫的少年中面向谷歌编程最厉害的.NET程序员。
        我的博客：yuiter.com
        博客园博客：www.cnblogs.com/danvic712