vue3.0新特性

| 企服解答

vue3.0新特性有：1、支持tree-shaking；2、新增setup；3、引入了Composition API；4、新增三个组件（Fragment、Teleport、Suspense）；5、响应式API；6、响应式侦听等。

vue3.0新特性

1、支持tree-shaking：

引入了Tree-Shaking，在Vue3中，所有的API都通过ES6模块化的方式引入，这样就能让webpack或rollup等打包工具在打包时对没有用到API进行剔除，最小化bundle体积。

2、新增setup：

在vue3中，新增了一个setup生命周期函数，setup执行的时机是在beforeCreate生命函数之前执行，因此在这个函数中是不能通过this来获取实例的；同时为了命名的统一，将beforeDestroy改名为beforeUnmount，destroyed改名为unmounted。

3、引入了Composition API：

Composition API可以将同一个功能的逻辑，组织在一个函数内部，利于维护。

4、新增三个组件（Fragment、Teleport、Suspense）：

（1）Fragment指的是片段。在vue2.x中，要求每个模板必须有一个根节点，而在Vue3中，因为新增了Fragment，所以编写时可以不需要根节点，这样就少了很多没有意义的div元素。

（2）Teleport可以将插槽中的元素或者组件传送到页面的其他位置。

（3）Suspense是Vue3推出的一个内置组件，它允许我们的程序在等待异步组件时渲染一些后备的内容，可以让我们创建一个平滑的用户体验。

5、响应式API：

Vue3提供一个函数ref。

在vue3中将computed功能进行了抽离，它接受一个getter函数，并为getter返回的值创建了一个不可变的响应式ref对象。

6、响应式侦听：

和computed相对应的就是watch，computed是多对一的关系，而watch则是一对多的关系；vue3也提供了两个函数来侦听数据源的变化：watch和watchEffect。

| 扩展阅读

Vue是一套用于构建用户界面的渐进式框架。Vue被设计为可以自底向上逐层应用，它的核心库只关注视图层，不仅易于上手，还便于与第三方库或既有项目整合。

Vue是一款目前最流行的前端框架之一，它将组成一个页面的HTML，CSS和JS合并到一个组件中，可以被其他组件或页面引入而重复利用。

通常每个.Vue文件作为一个组件导出，组件可以作为基础组件（如按钮）或一个页面（如登录页面）。组件化很好的将一个庞大复杂的前端工程拆分为一个个组件，重复利用的性质也大大提高了开发的效率。