Vue基础知识系列(一)Vue的基本认识

时间 2020-01-13

标签 vue 基础知识系列基本认识繁體版

原文原文链接

前言

这是一个系列的笔记，记录学习Vue的过程，笔记都是基础知识。这个系列笔记主要参考了本身淘宝买的视频的笔记，里面还夹杂了本身的见解都是本身纯手打的。若是有须要Vue视频资源的能够加我wx：15732676936。 后面回更新一些Vue常见面试题的文章，但愿各位看官看了稍稍微有些借鉴html

1、什么是Vue.js

Vue.js是前端的主流框架之一，和Angular.js、React.js一块儿，并称为前端三大主流框架！
Vue.js是一套构建用户界面的框架，只关注视图层，它不只易于上手，还便于与第三方库或既有项目整合。（Vue有配套的第三方类库，能够整合起来作大型项目的开发）
前端的主要工做？主要负责MVC中的V这一层；主要工做就是和界面打交道

2、为何要学习主流框架

企业为了提高开发效率：在企业中，时间就是效率，效率就是金钱
提升开发效率的发展历程：原生JS->JQuery之类的库->前端模板引擎->Angular.js/Vue.js
在Vue中，一个核心的理念，就是让用户不在操做DOM元素，解放了用户的双手，让程序员能够更多的时间去关注业务逻辑层
加强本身就业时候的竞争力

3、框架和库的区别

框架：是一套完整的解决方案；对项目的侵入性较大，项目若是须要更换框架，择须要从新架构整个项目。
库（插件）：提供某个小功能，对项目的侵入性较小，若是某个库没法完成某些需求，能够很容易切换到其它库实现需求。

4、Node(后端)中的MVC与前端中的MVVM之间的区别

MVC 是后端的分层开发的概念；前端
- M-Model层
- V-前端视图层
- C-业务逻辑层
MVVM 是前端视图层的概念，主要关注于视图层，也就是说:MVVM 把前端的视图层，分为了三个部分 Model、View、ViewModelvue

Model：就是建立vm实例中的data数据程序员

View：就是展示给用户的#app的整个div面试

ViewModel：建立的整个vm实例后端

为何有了MVC还须要了解MVVM浏览器

5、如何定义基本的Vue代码结构

<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Vue的基本代码</title> <!--第一步:导入vue包--> <script src="lib/vue-2.4.0.js"></script> </head> <body><!--未来控制new的vue实例，会控制这个元素中的内容--> <div id="app"> <p>{{ msg }}</p> </div> <script> // 第二步:建立一个Vue实例  // 当咱们导入包以后，浏览器的内存中就多了一个Vue构造函数  var vm = new Vue({ el: "#app", //表示，当前咱们new的这个Vue实例，要控制页面上的那个区域  data: { //data属性中，存放的是el中要用到的数据 msg: "欢迎学习Vue" //经过Vue提供的指令，很方便的就能把数据渲染到页面上，程序员再也不 手动操做DOM元素了前端的Vue之类的框架，不提倡咱们去手动操做DOM元素了  } }) </script> </body> </html> 复制代码

代码规范：

大型公司或者大型项目代码规范都使用的是间隔2个字符，少数间隔4个字符。我也习惯了使用间隔2个字符，每一个编辑器的用法不只相同，本身搜索就行。架构