Consume data

Access layout

You can access the layout of the Generic Object through a set of predefined hooks.

useLayout

useLayout returns the evaluated layout of the Generic Object’s properties:

import { useLayout } from "@nebula.js/stardust";

export default function () {
  return {
    qae: {
      properties: {
        qHyperCubeDef: {},
        simpleMath: {
          qValueExpression: {
            qExpr: "1+1",
          },
        },
      },
    },
    component() {
      const layout = useLayout();
      console.log(layout); // { qHyperCube: {/* HyperCube Layout */}, simpleMath: 2 }
    },
  };
}

You should useEffect when observing changes on the layout:

const layout = useLayout();

useEffect(() => {
  // do some heavy update
}, [layout]);

useAppLayout

useAppLayout returns the NxAppLayout you are currently connected to:

import { useAppLayout } from "@nebula.js/stardust";

export default function () {
  return {
    component() {
      const appLayout = useAppLayout();
      console.log(appLayout); // { qTitle: 'App title', qLocaleInfo: {/* */ } }
    },
  };
}

The most common use case for the app layout is to access qLocaleInfo which contains locale details selected by the app owner and should be used to format numbers.

Models

In addition to the layouts of the app and generic object, you have full access to the APIs generated by enigma.js. These APIs are generated from a JSON-RPC schema and unlocks the full power of Qlik’s Associate Engine.

useModel

useModel returns the generated API of the Generic Object:

import { useModel } from "@nebula.js/stardust";

export default function () {
  return {
    component() {
      const model = useModel();
      model.getInfo().then((info) => {
        console.log(info);
      });
    },
  };
}

Common operations in this API is to:

  • make selections with beginSelections, selectHyperCubeValues and endSelections
  • get more data with getHyperCubeData

useApp

useApp returns the generated API of the Doc:

import { useApp } from "@nebula.js/stardust";

export default function () {
  return {
    component() {
      const app = useApp();
      app.clearAll();
    },
  };
}

Common operations in this API is to:

  • modify the selection stack with clearAll, back, forward
  • create and apply bookmarks with createBookmark and applyBookmark

useGlobal

useGlobal returns the generated API of the Global:

import { useGlobal } from "@nebula.js/stardust";

export default function () {
  return {
    component() {
      const g = useGlobal();
      g.engineVersion().then((v) => {
        console.log(v);
      });
    },
  };
}

Common operations in this API is to:

  • get a list of apps with getDocList
Was this page helpful?