from

Converts a callback subscription, an Observable or an AsyncIterable into an AsyncIterable for a Solid computation. A subscription keeps only the latest value, and a value the source emits during subscribe is served without a loading frame; an AsyncIterable streams every value through.

The source closes on supersede — the owning computation re-running — and on owner disposal. Inside an async generator memo that holds for a for await that starts before the first await; one that starts after it has no owner to bind to, so its source closes only when the loop ends. Prefer returning from(...) from its own memo, with awaited inputs read from upstream memos and transforms done in a downstream memo.

Iterate the result with for await or return it from a computation: its next() returns an already-buffered value as a bare result, not a promise.

Import

import { from } from "solid-js";

Type signature

function from<T>(source: FromSource<T>): AsyncIterable<T>;

Parameters

source

• Type: FromSource<T>

A subscribe function (next, error, complete) => unsubscribe, an object with subscribe(observer) such as an Observable, or an AsyncIterable. See FromSource below.

Examples

const position = createMemo(() =>
  from<Position>((next, error) => {
    const id = navigator.geolocation.watchPosition(next, error);
    return () => navigator.geolocation.clearWatch(id);
  })
);
const ticks = createMemo(() => from(interval$(rate())));

Caveats

• During hydration, a subscription read on the server reconnects on the client once its section has hydrated, instead of staying at the server's value.

Learn more

• Async reactivity
• Integrate non-Solid code

Related types

FromSource

Anything from accepts: a subscribe function ((next, error, complete) => unsubscribe), an object with subscribe(observer) (RxJS and TC39 Observables, including Symbol.observable / "@@observable" interop), or an AsyncIterable.

type FromSource<T> =
  | ((
      next: (value: T) => void,
      error: (err: unknown) => void,
      complete: () => void
    ) => Teardown)
  | { subscribe(observer: FromObserver<T>): Teardown }
  | AsyncIterable<T>;