一，什么是Vue.observable
Vue.observable 是 Vue 2.6 引入的一个新功能，用于创建可观察的对象。它的 主要作用是将一个普通的 JavaScript 对象转换为一个可观察的对象，使得当对象的属性发生变化时，可以自动触发相应的响应式更新。 这对于在 Vue 组件之外处理数据非常有用，例如在 Vuex store、事件总线或者与第三方库集成时。
二，使用场景
- 在 Vue 组件之外处理数据，例如在 Vuex store 中。
- 与第三方库集成，例如与 Socket.io 实时通信。
- 在组件之间共享数据，但不使用 Vuex。
创建一个可观察的对象，用于跟踪表单输入的变化。
三，主要作用
将普通对象转换为可观察对象，使其具有响应式更新的能力。
- 当可观察对象的属性发生变化时，自动触发相应的响应式更新。
- 可以在 Vue 组件之外处理数据，方便与第三方库集成。
四，代码示例
// 引入 Vue
import Vue from 'vue';
// 创建一个普通对象
const data = {
message: '您好, Vue.observable!'
};
// 使用 Vue.observable 将普通对象转换为可观察对象
const observableData = Vue.observable(data);
// 监听可观察对象的属性变化
observableData.$watch('message', function (newVal, oldVal) {
console.log('信息的变化 from', oldVal, 'to', newVal);
});
// 修改可观察对象的属性
observableData.message = '您好, 还是大剑师兰特';
在这个示例中， 我们首先创建了一个普通的对象 data，然后使用 Vue.observable 将其转换为可观察对象 observableData。接着，我们使用 $watch 方法监听 message 属性的变化。最后，我们修改 message 属性的值，控制台会输出属性变化的信息。
// 输出：信息的变化from Hello,您好, Vue.observable! to 您好, 还是大剑师兰特
五，注意事项
Vue.observable 仅适用于 Vue 2.6 及以上版本。在 Vue 3 中，这个功能已经被移除，取而代之的是使用 reactive 和 ref 创建响应式对象。
