سلام ، همکار RxJS همکار! ?
امروز می خواهم یک بسته JS / TS را به اشتراک بگذارم که به شما امکان می دهد به وسایل موجود در Observables دسترسی داشته باشید:
source$.subscribe(o => console.log(o?.a?.b?.c))
// turn ↑ into ↓
source$.a.b.c.subscribe(console.log)
tl؛ dr: github.com/kosich/rxjs-proxify
یک مورد استفاده ساده:
msg
ویژگی هر مقدار در جریان
import { proxify } from "rxjs-proxify";
import { of } from "rxjs";
const source = of({ msg: 'Hello' }, { msg: 'World' });
const stream = proxify(source);
stream.msg.subscribe(console.log); // 'Hello', 'World'
☝️
proxify
یک پروکسی برای داده قابل مشاهده ایجاد می کند
حتی می توانید از انتساب JS برای تخریب استفاده کنید:
const { msg } = proxify(source);
msg.subscribe(console.log); // 'Hello', 'World'
این بسته از پشتیبانی TypeScript خوبی برخوردار است ، بنابراین همه لوازم جانبی توسط گربه ها ، سگ ها و IDE ها هوشمند هستند:
import { of } from 'rxjs';
import { proxify } from 'rxjs-proxify';
const source = of({ a:1, b:1 }, { a:2, b:2 });
const stream = proxify(source);
stream. // <- will suggest .a .b .pipe .subscribe etc
? من می توانم اهداف شما را ببینم
همچنین می توان متدها را روی مقادیر فراخوانی کرد (حتی آنهایی که استفاده می کنند)
this
کلمه کلیدی) ، به عنوان مثال:
import { proxify } from "rxjs-proxify";
import { of } from "rxjs";
const source = of({ msg: () => 'Hello' }, { msg: () => 'World' });
const stream = proxify(source);
// calls msg() fn on each value of the stream
stream.msg().subscribe(console.log); // 'Hello', 'World'
magic جادوی ناب ، من به شما می گویم
و شما هنوز آزادید که اپراتورهای RxJS را در هر عمق اعمال کنید:
import { proxify } from "rxjs-proxify";
import { of } from "rxjs";
import { scan } from "rxjs/operators";
const source = of({ msg: 'Hello' }, { msg: 'World' });
const stream = proxify(source);
stream.msg.pipe(scan((a, c)=> a + c)).subscribe(console.log); // 'HelloWorld'
درست مثل مشاهدات عادی!
این بسته از Proxies در زیر کاپوت استفاده می کند و آن را بطور بازگشتی در خصوصیات فرعی و نتایج روش اعمال می کند ، بنابراین این زنجیره می تواند به طور نامحدود عمیق باشد. و می توانید هر زمان که بخواهید. اشتراک یا .pipe اعمال کنید!
امتحان کنید
می توانید از طریق آن نصب کنید
npm i rxjs-proxify
یا بصورت آنلاین تست کنید: stackblitz.com/edit/rxjs-proxify-repl
? مخزن
کد منبع و مثالهای بیشتر در این نسخه از سایت GitHub موجود است: github.com/kosich/rxjs-proxify
بیرون
اگر از خواندن لذت می برید – لطفاً این نکته را با دکمه های indicate نشان دهید – کمک زیادی می کند!
به زودی بررسی دقیق تری از lib و نحوه کار آن را ارسال می کنم
دنبالم کن توییتر برای ارسال های بیشتر RxJS ، React و JS
برای خواندن این مقاله از شما تشکر می کنم! واکنش پذیر باشید و روز خوبی داشته باشید
Psst .. برای مطالعه به چیز دیگری احتیاج دارید؟
من شما را تحت پوشش قرار دادم:
سیا
همچنین در https://dev.to/rxjs/turn-a-stream-objeks-into-an-object- of-streamams-2aed
برچسب ها
حساب رایگان خود را ایجاد کنید تا قفل تجربه خواندن سفارشی خود را باز کنید.