后端人眼中的Vue(一)

一、简介

1.1、Vue简介

后端人眼中的Vue(一)_第1张图片

​ Vue是渐进式 JavaScript 框架,啥叫渐进式?渐进式意味着你可以将Vue作为你应用的一部分嵌入其中,或者如果你希望将更多的业务逻辑使用Vue实现,那么Vue的核心库以及其生态系统。比如Core+Vue-router+Vuex+axios,也可以满足你各种各样的需求。

​ Vue的特点和Web开发中常见的高级功能:

​ 1、解耦视图和数据

​ 2、双向数据绑定

​ 3、可复用的组件

​ 4、前端路由技术

​ 5、状态管理

​ 6、虚拟DOM

​ Vue对于后端人员来说,Vue就是Js框架, 让我们通过操作很少的DOM,甚至不需要操作页面中任何DOM元素,就很容易的完成数据和视图绑定,即双向绑定(MVVM)。正是因为有MVVM架构的基础,才有了前后端分离的基础。

1.2、语法对比

如果我们想要获取dom的内容。

1.2.1、原生JavaScript

document.getElomentById("username").value //获取值
document.getElomentById("username").value = "XiaoLin" //设置值

1.2.2、JQuery

$("#username").val(); //获取值
$("#username").val("XiaoLin") //设置值

1.3、MVVM

后端人眼中的Vue(一)_第2张图片

MVVM指的是前端中的三层:View层、Model层、ViewModel层。

  1. 视图层,在前端里就是我们常说的DOM层,主要作用是给用户展示各种信息。
  2. 数据层,数据可能是我们自定定义的数据,或者是从网络请求下来的数据。
  3. 视图模型层,是View层和Model层沟通的桥梁;一方面它实现了数据绑定(Data Binding),将Model的改变实时反应到View中;另一方面它实现了DOM监听,当DOM发生改变可以对应改变数据(Data)。

二、快速入门

2.1、Vue的安装和使用

我们首先压迫引入Vue的文件,可以把他下载到本地引用使用在线引入。

2.1.1、安装

2.1.1.1、CDN在线引用

 
<script src="https://cdn.jsdelivr.net/npm/vue/dist/vue.js">script>


                    
                    

你可能感兴趣的:(前端,vue.js,前端,javascript)