vue是什么？vue的优点有哪些？

大可-

已于 2023-07-20 11:35:02 修改

阅读量1.5k

点赞数 7

文章标签：前端 vue.js 前端框架 Powered by 金山文档

于 2023-03-15 21:45:55 首次发布

本文链接：https://blog.csdn.net/m0_55333789/article/details/129569122

版权

Vue是一套轻量级的渐进式框架，强调数据驱动和组件化。它的核心特点包括MVVM模式、响应式系统、以及清晰的生命周期。Vue允许开发者从简单的组件开始构建，提高开发效率，同时具备高性能、易上手的特性，且拥有丰富的生态系统和插件支持。

摘要由CSDN通过智能技术生成

一、vue是什么

Vue是一套用于构建用户界面的渐进式JavaScript框架

vue就是一个js库，并且无依赖别的js库，直接引入一个js文件就可以使用，与传统JS和JQuery框架不同，Vue的渐进式框架表示开发者可以由简单组件写起，渐渐搭建出一个复杂的前端平台。

形成Vue渐进式框架的核心概念为：组件化，MVVM，响应式，和生命周期。

`Vue一切是数据为核心，使用数据来驱动视图刷新，我们不建议去操作dom

二、为什么要用Vue？

1. 组件化

Vue将组成一个页面的HTML，CSS和JS合并到一个组件中，可以被其他组件或页面引入而重复利用。通常每个.Vue文件作为一个组件导出，组件可以作为基础组件（如按钮）或一个页面（如登录页面）。组件化很好的将一个庞大复杂的前端工程拆分为一个个组件，重复利用的性质也大大提高了开发的效率。

<template>
    <div class="demo">
        <h2>学校名称：{{name}}</h2>
        <button @click="showName">点我提示学校名</button>    
    </div>
</template>
 
<script>
     export default {
        name:'School',
        data(){
            return {
                name:'bdqn',
            }
        },
        methods: {
            showName(){
                alert(this.name)
            }
        },
    }
</script>
 
<style>
    .demo{
        background-color: orange;
    }
</style>

2、Vue 只关注视图层，采用自底向上增量开发的设计

视图层：HTML中的dom其实就是视图，一个网页就是通过dom的组合与嵌套，形成了最基本的视图结构，再通过css的修饰，在基本的视图结构上“化妆”让他们看起来更加美观。最后涉及到交互部分，就需要用到JavaScript来接收用户的交互请求，并且通过事件机制来响应用户的交互操作，并且在事件的处理函数中进行各种数据的修改，比如说修改某个dom中的innerHTML或者innerText部分。

我们把HTML中的dom就可以与其他的部分独立开来划分出一个层次，这个层次就叫视图层。

MVVM(Model-View-ViewModel):由Model,View,ViewModel三部分构成，Model层代表数据模型，也可以在Model中定义数据和操作的业务逻辑；View代表UI组件，它负责将数据模型转化成UI展现出来，ViewModel是一个同步View和Model的对象。它是一种基于前端开发的架构模式，其核心是提供对View和ViewModel的双向数据绑定，这使得ViewModel的状态改变可以自动传递给View，即所谓的数据双向绑定。