Nuanced Pumpkin Mavens

    @vueuse/rxjs
    TypeScript icon, indicating that this package has built-in type declarations

    9.3.0 • Public • Published

    @vueuse/rxjs

    NPM version

    This is an add-on of VueUse, enables of a natural way the use of RxJS.

    Install

    npm i @vueuse/rxjs rxjs
    

    Functions

    Example

    import { from, fromEvent, useObservable } from '@vueuse/rxjs'
    import { ref } from 'vue'
    import { forkJoin, of } from 'rxjs'
    import { ajax } from 'rxjs/ajax'
    import { concatAll, map, mergeMap, pluck, scan, take } from 'rxjs/operators'
    
    const BASE_URL = 'https://jsonplaceholder.typicode.com'
    const button = ref<HTMLButtonElement>(null)
    
    const posts = useObservable(
      fromEvent(button, 'click').pipe(
        mergeMap(() => ajax.getJSON(`${BASE_URL}/posts`).pipe(
          concatAll(),
          take(4),
          mergeMap(({ id, userId, title }) => forkJoin({
            id: of(id),
            comments: ajax.getJSON(`${BASE_URL}/posts/${id}/comments`).pipe(
              map(comments => comments.length),
            ),
            username: ajax.getJSON(`${BASE_URL}/users/${userId}`).pipe(
              pluck('username'),
            ),
          }), 2),
          scan((acc, curr) => [...acc, curr], []),
        )),
      ),
    )

    License

    MIT License © 2019-PRESENT Anthony Fu

    Install

    npm i @vueuse/rxjs

    DownloadsWeekly Downloads

    1,773

    Version

    9.3.0

    License

    MIT

    Unpacked Size

    16 kB

    Total Files

    8

    Last publish

    Collaborators

    • antfu
    • egoist
    • tahul