RecoilのLoadable

簡略化した型

code:ts

type Loadable<T> =

| {

state: 'loading';

contents: Promise<T>;

}

| {

state: 'hasValue';

contents: T;

}

| {

state: 'hasError';

contents: any;

};

2つのpropertyを持つ

state

Loadableの状態を表す

contents

値を格納する

3つの状態を持つ

loading

まだ value が確定していない状態

contentsにはvalueのPromiseが格納されている

hasValue

valueが確定した状態

contentsにはvalueが格納されている

hasError

非同期処理がエラーで終了した状態

contentsにはErrorが格納されている

API

getValue()

getPromise()

valueMaybe()

valueOrThrow()

それ以外はthrow

map(callback)

型定義

code:ts

interface BaseLoadable<T> {

getValue: () => T;

toPromise: () => Promise<T>;

valueMaybe: () => T | void;

valueOrThrow: () => T;

errorMaybe: () => Error | void;

errorOrThrow: () => Error;

promiseMaybe: () => Promise<T> | void;

promiseOrThrow: () => Promise<T>;

map: <S>(map: (from: T) => Promise<S> | S) => Loadable<S>;

}

interface ValueLoadable<T> extends BaseLoadable<T> {

state: 'hasValue';

contents: T;

}

interface LoadingLoadable<T> extends BaseLoadable<T> {

state: 'loading';

contents: LoadablePromise<T>;

}

interface ErrorLoadable<T> extends BaseLoadable<T> {

state: 'hasError';

contents: Error;

}

export type Loadable<T> =

| ValueLoadable<T>

| LoadingLoadable<T>

| ErrorLoadable<T>;

参考

わかりやすい

既に若干古い部分がある