响应式原理1

npuer

声明响应式状态
要为 JavaScript 对象创建响应式状态，可以使用 reactive 方法：

[ol]

import { reactive } from 'vue'

// 响应式状态

const state = reactive({

  count: 0

})[/ol]复制代码
reactive 相当于 Vue 2.x 中的 Vue.observable() API ，为避免与 RxJS 中的 observables 混淆因此对其重命名。该 API 返回一个响应式的对象状态。该响应式转换是“深度转换”——它会影响嵌套对象传递的所有 property。

Vue 中响应式状态的基本用例是我们可以在渲染期间使用它。因为依赖跟踪的关系，当响应式状态改变时视图会自动更新。

这就是 Vue 响应式系统的本质。当从组件中的 data() 返回一个对象时，它在内部交由 reactive() 使其成为响应式对象。模板会被编译成能够使用这些响应式 property 的渲染函数。

在响应式基础 API 章节你可以学习更多关于 reactive 的内容。