在单页面应用程序（SPA）中，响应性指的是应用程序根据底层数据的变化能够更新其用户界面的能力。响应性使我们能够编写更清晰的代码，避免了我们需要手动根据数据变化来更新界面。相反，界面会自动更新。 然而，JavaScript 本身并不具备这种能力，因此我们可以通过像 React、Vue 和 Angular 这样的库和框架来实现响应性。例如，在 Vue 中，我们可以创建一个称为状态（state）的数据集；Vue 然后使用一套观察者（observers）和监听器（watchers）系统来跟踪状态并更新我们的界面。 当 Vue 检测到状态变化时，它使用虚拟 DOM 来重新渲染界面，确保界面始终保持最新状态，通过使用记忆化（memoization）和选择性更新等技术，使该过程尽可能快速和高效。有几种不同的方式可以定义我们希望 Vue 跟踪的应用程序状态。例如，在 Vue 3 的组合式 API 出现之前，我们使用一个返回所需跟踪对象的数据函数。 Vue reactive() 我们可以使用 reactive() 在 Vue 的组合式 API 中声明对象或数组的状态： import { reactive } from 'vue' const state = reactive({ first_name: "laucher", last_name: "fasss", }) 在上面的代码片段中，我们使用 reactive() 函数告诉 Vue 我们希望跟踪这个对象的状态。然后，我们可以创建一个依赖于这个响应式对象的用户界面，Vue 将会跟踪状态对象并使用它来更新界面： <template> <div>{{state.first_name}} {{state.last_name}}</div> </template> <script> import { reactive } from ...