Options
All
  • Public
  • Public/Protected
  • All
Menu

Class SubscriptionState

subscribes components calling use() on instance of it, anytime update is called will rerender each subscribed component. on component unmount, the component will automatically be unsubscribed.

see

use

Hierarchy

Index

Constructors

Properties

Methods

Constructors

constructor

Properties

Protected lastSubscribedComponentKey

lastSubscribedComponentKey: number = 0

tracks last subscribed component key reference, each time component subscribes value be incremented, and such incremented value be used as key under which component will be subscribed

Protected subscribedEntries

subscribedEntries: {} = {}

will use {@see lastSubscribedComponentKey} and put under it {@see ISubscribedEntry}

Type declaration

Protected version

version: number = 0

state version be incremented on each update each time component renders, it's entry be updated with the version of this state. when it comes to decision if component should be updated, the version of update be compared to last rendered version, if they're same, or rendered version is bigger than state version it will be skipped. effectively this insures that component be updated exactly once for each version, preventing rerendering for e.g. nested components subscribed for same state.

Methods

Protected _update

  • _update(): void

Protected getNextSubscribedComponentId

  • getNextSubscribedComponentId(): number

Private incrementVersion

  • incrementVersion(): number

Private subscribe

  • subscribe(id: number, updateState: (...args: any) => any, options?: ISubscribeOptions<this>): void

Protected unsubscribe

  • unsubscribe(id: number): void

update

  • update(): void

  • exists for cases when you need to override it.

    example
    class FooState extends SubscriptionState {
      update = () => {
        doSomeLogic
        this._update()
      }
    }

    Returns void

use

  • subscribes component to this state represented by extending instance, behind the scenes will call useState using someNumber as it's initial state. the updateState from called useState and supplied options, will be stored under generated key on subscribed entries (simple object on this instance), any time update is called, all entries be traversed and corresponding update func be called, leading to update. on unmount entry will be deleted by the key it was subscribed under.

    as options may be passed:

    updateDeps?: a function that returns an array of dependencies. Before the next update, same func be called, and it's contents compared against the result of previous call. If both are same, update will be ignored onUnsubscribed?: any cleanup function on component's unmount. options are optional

    example
    someState.use() // on update call will trigger update for this component
    someState.use({
        updateDeps: (state) => [state.foo, state.bar]
    }) // will only update if return func of updateDeps is different since last update
    // comparison will happen shallowly and strict.


    //---------------------

    // how it basically works:
    class SomeState extends SubscriptionState {
      counter = 1

      updateCounter = () => {
         this.counter += 1
         this.update()
      }
    }

    SomeComponent
      someState.use()

    // someState.subScribedEntries // {1: {updateState, ...}}

    OtherComponent
      someState.use()

    // someState.subScribedEntries // {2: {updateState, ...}}
    // someState.update() // will just iterate over subscribed components and call update function so they're rerendered
    // that's it.

    Parameters

    Returns SubscriptionState

Generated using TypeDoc