前端web之vue基础(6)

vue介绍

什么是vue

vue.js是一套构建用户界面的渐进式框架,用来快速构建GUI页面。
vue.js 通过尽可能简单的 API 实现响应的数据绑定和组合的视图组件。通过MVVM思想实现数据的双向绑定,让开发者不用再操作dom对象,有更多的时间去思考业务逻辑。
Vue.js 专注于 MVVM 模型的 ViewModel 层。它通过双向数据绑定把 View 层和 Model 层连接了起来。实际的 DOM 封装和输出格式都被抽象为了 Directives 和 Filters。

为什么使用vue.js

  • 轻量级框架
    vue.js通过简洁的API提供高效的数据绑定和灵活的组件系统。
  • 双向数据绑定
    vue.js会自动对页面中某些数据的变化做出同步的响应。
    也就是说,vue.js会自动响应数据的变化情况,并且根据用户在代码中预先写好的绑定关系,对所有绑定在一起的数据和视图内容都进行修改。
    通过MVVM思想实现数据的双向绑定,让开发者不用再操作dom对象,有更多的时间去思考业务逻辑。
  • 组件化
    vue.js通过组件,把一个单页应用中的各种模块拆分到一个一个单独的组件(component)中,我们只要先在父级应用中写好各种组件标签(占坑),并且在组件标签中写好要传入组件的参数(就像给函数传入参数一样,这个参数叫做组件的属性),然后再分别写好各种组件的实现(填坑),然后整个应用就算做完了。
  • 视图,数据,结构分离
    使数据的更改更为简单,不需要进行逻辑代码的修改,只需要操作数据就能完成相关操作
  • 虚拟DOM
    在传统开发中,用JQuery或者原生的JavaScript DOM操作函数对DOM进行频繁操作的时候,浏览器要不停的渲染新的DOM树,导致页面看起来非常卡顿。
    vue.js使用虚拟DOM,可以预先通过JavaScript进行各种计算,把最终的DOM操作计算出来并优化,由于这个DOM操作属于预处理操作,并没有真实的操作DOM,所以叫做虚拟DOM。最后在计算完毕才真正将DOM操作提交,将DOM操作变化反映到DOM树上。

如何使用vue.js

主要有两种使用方式:
方式一:
直接在html中使用

你可能感兴趣的:(前端)