在 Vue 2.0 期间，我们所需要的数据会存在 data 下，并用 return 返回值，这样 Vue 在 Object.defineProperty() 方法，会把数据都变成响应式的，而我们不需要监听的数据呢，一般都是放在 Vue 那一层。
data() { this.web0 = \\\'web0\\\';//不监听数据变化 return { web1:\\\'web1\\\' }}
this.web0 = \\’web0\\’ 很少人会注意到这种处理技巧。一般情况下，大家都会囫囵吞枣的放在 return 方法里，殊不知 Vue2 里 defineProperty 方法中，会在初始化项目的时候，遍历所有数据，使其都变成「响应式」数据，对于大项目，无疑会浪费掉很多性能。种种的代码细节，会展示出对于 Vue 的熟知程度。
（这种代码规范还是应该多了解些，不过，Vue 最终目的是为了提高我们工作中的生产力。）
在 Vue3 中「响应式」监听把 defineProperty 换成 Proxy 方法，只有在你访问到数据的时候，才会变成响应式数据。
数据的声明方式也变成了「需要大家自己去想」，想什么呢？你在项目中哪些变量需要监听，哪些变量不需要监听。并且，提供了两种包装方式「ref、reactive」:
可以看下官网的例子，ref 定义基础类型，reactive 定义引用类型。
setup(){ const count = ref<number>(0) const web = ref<string>(\\\'web\\\') return { count, web }}
我们在 setup 函数里获取 count 值时，不能直接使用 count，想获取 count 定义的值，需要使用 count.value ，赋值的时候也需要给 count.value 赋值。
多提一句：在 ESLint 中为什么建议使用 const 来定义数据，它有什么好处？大家都知道 let 和 const 的区别，let 定义的是变量，可以更改数据，const 定义的是常量，不允许更改。
如果一个变量可以确定后面不会更改它的值，那还是要用 const 来声明，这样可以减少认知负荷，提高可维护性。（文末
原创文章，作者：小道研究，如若转载，请注明出处：https://www.sudun.com/ask/34609.html
