1.简介
Vue (发音为 /vjuː/,类似 view) 是一款轻量级的用于构建用户界面的 渐进式的JavaScript 框架。它基于标准 HTML、CSS 和 JavaScript 构建,并提供了一套声明式的、组件化的编程模型,帮助你高效地开发用户界面。无论是简单还是复杂的界面,Vue 都可以胜任。
Vue 还可以与其他库或框架结合使用,例如 React 或 AngularJS。它还可以与现代工具链和构建工具进行集成,例如 Webpack 或 Gulp,使其更加灵活和可扩展。
Vue的发明人==尤雨溪==(Evan You)先生是一位前Google工程师,于2014年发布了Vue.js这个JavaScript框架。Vue.js以其简洁易用、高效灵活的特点赢得了许多开发者的青睐,并成为前端开发中备受推崇的框架之一
Vue2官网:https://v2.cn.vuejs.org/
, Vue 2 已于 2023 年 12 月 31 日停止维护
Vue3官网:https://cn.vuejs.org/guide/introduction
咱们在这里讲的是Vue2…… Vue2会了,Vue3很容易上手
2.渐进式
所谓渐进式,你可以理解为:就是一开始不需要你完全掌握它的全部功能特性,可以后续逐步增加功能。不多做职责之外的事情
VUE不强求你一次性接受并使用它的全部功能特性,它允许开发者按照自己的需求逐步地引入Vue的功能和特性。
-
例如,你可以只使用Vue的数据绑定和模板语法,而不使用Vue的路由和状态管理。
再比如,你现在有一个传统的多页面 Web 应用程序,其中有一个页面是一个简单的待办事项列表,你希望在这个页面中引入 Vue.js 来提供更好的交互性和用户体验。
-
这个时候,你只需要引入Vue.js核心库,然后使用Vue来管理列表的状态即可。 客户无感,并且很平滑的过渡。
-
一个月后,你引入vue-router 来实现路由导航。
-
两个月后,引入Vuex 来管理待办事项列表的状态,并使用单文件组件来组织代码等。
通过逐步引入 Vue.js 的各种功能,你可以在不中断现有功能的情况下,改进现有的 Web 应用程序,使其具备更好的交互性和用户体验。这种渐进式的特性使得 Vue.js 成为一个非常灵活和可扩展的前端框架。
传统的前端框架通常会将整个项目的架构和开发方式紧密地绑定在一起,开发者必须按照预先确定的框架结构和规则来进行开发。这种方式在一些大型项目中可能会产生一些问题,比如过于复杂的架构、开发效率低下、难以进行增量开发等。
3. Vue的核心思想
vue在框架的设计上,采用了两个核心思想,一个是响应式数据绑定(也叫数据驱动),另一个就是组件化。
响应式数据绑定:
在vue中,数据的改变会驱动视图的自动更新。传统的做法是需要手动改变DOM来使得视图更新,而vue只需要改变数据。
这是通过使用ES5的`Object.defineProperty()`实现数据的观察,或者ES6的`Proxy`实现的。
let name = "michael"
document.getElementById("input").value = name;
name="lucy" <==改变了数据(状态)
document.getElementById("input").value = name; <==还得操作一次DOM对象
组件化
可以将页面拆分为不同的组件,每个组件都包含自己的HTML模板、JavaScript代码和CSS样式。一是提高代码的复用性,二能降低数据之间的耦合度。组件之间也可以进行通信。 一个页面/模块可以由多个组件所组成