spz-state#

#When to use

spz-state is a state management component that persists state to localStorage or sessionStorage.

#Supported layout

• container

#Example

<spz-state id="insList" state-key="insListState" state-id="aaa" layout="container">
  <spz-render src="custom:insList.getState" layout="container">
    <template>
      <div>
        <div class="click" @tap="insList.toggle">click</div>
        <div class="${data['aaa'] && data['aaa'].state ? 'active' : ''}">aaaa</div>
      </div>
    </template>
  </spz-render>
</spz-state>

#Attributes

#Methods

#getData()

Returns all state data.

Return format:

{
  state_id: any
}

#getState(params?)

Gets the state for a specified state_id. Priority: parameter > component state-id attribute > return all state.

Parameters:

• params (optional) — a state_id string or a parameter object {state_id: 'value'}

Return format:

{
  state_id: any
}

#Actions

#toggle

Toggle the state of a specified state_id. Priority: parameter > component state-id attribute.

Parameters:

• state_id (optional) — the state_id to toggle

#Events

#Notes

• State is persisted to localStorage or sessionStorage based on the state-type attribute.
• Downstream components can access state via custom:<id>.getState.