<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta http-equiv="X-UA-Compatible" content="IE=edge" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>vue2 与 vue3 的区别</title> </head> <body> <script> let a1 = `vue2的双向数据绑定是利用ES5的api Object.definePropert()对数据进行劫持，结合发布订阅模式的方式来实现的； vue3中使用了es6的 Proxy API 对数据的代理； 优势： 1：defineProprety只能监听某个属性，不能对全对象监听； 2：可以省去for in 闭包等内容来提升效率，直接绑定整个对象即可 3：可以监听数组；`; let a2 = `vue2中定义数据变量是data，创建的方法是在methods中 vue3中是直接在setup中，新语糖是不需要return，相当方便`; let a3 = `vue2与vue3生命周期钩子函数不同； setup obBeforMount onMounted onBeforUpdate onUpdated 需要先引入`; let a4 = `Vue3.x还增加了onRenderTracked 和onRenderTriggered函数 分别是状态变更和状态触发， 调试会用，生产不会`; </script> </body> </html>