前端学习vue：vue3新特性1

六大亮点：

    Performance（性能）:    性能更比Vue2.0强。

    Tree shaking support: 可以将无用模块“剪辑”，仅打包需要的。 (打包整个项目可以变小)

    Composition API : 组合API。（开发者用的多一些）。

    碎片和悬念。

    Better TypeScript support: 更优秀的Ts支持。（以前vue源码是js写的，现在是ts写的）。

    Custom Renderer API： 暴露了自定义渲染API。

    

组合ＡＰＩ　：

        Ref或者reactive。

        使用ｓｅｔｕｐ（）｛｝　函数，这就是组合式API，所有东西写到这里面。

        

    之前我们在＜ｔｅｍｐｌａｔｅ＞标签里显示的数据，都是在ｄａｔａ里定义好的，

现在３.０呢我们可以通过　ｒｅｆ　或者　ｒｅａｃｔｉｖｅ创建响应式对象。

先导入：ｉｍｐｏｒｔ　　｛ｒｅｆ，ｒｅａｃｔｉｖｅ｝　ｆｒｏｍ　＂ｖｕｅ＂

然后在ｓｅｔｕｐ里声明和响应同样能起到ｄａｔａ的效果：

ｉｍｐｏｒｔ　　｛ｒｅｆ，ｒｅａｃｔｉｖｅ｝　ｆｒｏｍ　＂ｖｕｅ＂　需要哪个知识点引入哪个就会以上面优点里提到的，剪辑　效果引入进来。

显示效果：

ｒｅａｃｔｉｖｅ　主要是用来对象　数组之类的复杂类型。

显示效果：

ｒｅｆ　基本类型使用比较高，ｒｅａｃｔｉｖｅ　复杂类型使用比较高。

为什么ｄａｔａ被ｓｅｔｕｐ取代？？？

这是Vue3里支持的两种语法，并不是替代，分别是【选项式】和【组合式】
data()是【选项式】语法，Vue2、Vue3都支持；Element UI是基于Vue2，示例是典型的【选项式】语法
setup是【组合式】语法，Vue3支持；Element Plus是基于Vue3，示例用的是【组合式】语法，也可以用【选项式】语法。

ｖｕｅ３以前的事件都是ｍｅｔｈｏｄ处理的：

点击后就有打印。记得ｒｅｔｕｒｎ里也要写　ｃｌｉｃｋＨａｎｄｌｅ．

ｖｕｅ３.０可以　放在　

ｓｅｔｕｐ中使用　ｐｒｏｐｓ和ｃｏｎｔｅｘｔ．

３.０　无法使用和２.０一样的ｔｈｉｓ　但是可以通过接收　ｓｅｔｕｐ（ｐｒｏｐｓ，ｃｔｘ）的方法　获取当前组件的实例和ｐｒｏｐｓ．

ｓｅｔｕｐ这块代码也可以写在ｊｓ里。

ｓｅｔｕｐ方法里没有this。

ｃｔｘ就是当前实例对象。

其他可以看下官方的ｓｅｔｕｐ文档更详细描述。