rxjs ofObjectChanges 已过时

标签 rxjs

ofObjectChanges 建立在 Object.observe() 这是过时的( https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Object/observe )我正在寻找一种替代方法来观察对象属性的变化。有人知道吗?

最佳答案

也许使用代理是一种选择,尽管需要替换原始对象

const { Subject } = require('rxjs');

// Take an object, and return a proxy with an 'observation$' stream
const toObservableObject = targetObject => {
    const observation$ = new Subject();
    return new Proxy(targetObject, {
        set: (target, name, value) => {
            const oldValue = target[name];
            const newValue = value;
            target[name] = value;
            observation$.next({ name, oldValue, newValue });
        },

        get: (target, name) => name == 'observation$' ? observation$ : target[name]
    });
}

const observableObject = toObservableObject({ });

observableObject.observation$
    .filter(modification => modification.name == 'something')
    .subscribe(({ name, oldValue, newValue }) => console.log(`${name} changed from ${oldValue} to ${newValue}`));

observableObject.something = 1;
observableObject.something = 2;

输出
something changed from undefined to 1
something changed from 1 to 2

在兼容性表中查找 Proxy 当前节点版本已完全支持)
https://kangax.github.io/compat-table/es6/

和代理的文档在
https://developer.mozilla.org/en/docs/Web/JavaScript/Reference/Global_Objects/Proxy

关于rxjs ofObjectChanges 已过时,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/36001392/

相关文章:

angular - 如何在 Angular 2 的不同服务中订阅可观察对象

Rxjs 多文件上传队列,具有重试和停止行为

javascript - 为什么 RxJS subscribe 允许省略箭头函数和下面的方法参数?

javascript - JS 中 observable 返回结果

angular - this.handleError 不是函数

reactive-programming - RXJS : Idiomatic way to create an observable stream from a paged interface

angular - 父/子组件之间使用 RXJS 或 @input/@output 进行通信哪个更好

javascript - 如何在 React 中使用 Rxjs 返回 Promise?

javascript - 如何在 Angular http 拦截器中以异步方式缓存 http 请求?

javascript - 仅当还不是 Observable 时才转换为 Observable