Skip to main content

request-data

Emitted by the store when a column with dataStatus: "unknown" becomes visible. The store doesn't consume this action itself - it marks the column as "loading" and passes the action through the event bus so external code can fetch the data and respond with provide-data.

Requires dynamicData: true on the component. If dynamicData is false, the action is a no-op.

Usage​

type RequestDataPayload = {
	id: ColumnID;
};
FieldTypeDescription
idColumnIDID of the column that needs its cards loaded

Store behavior:

  • If dynamicData is false, or the column ID doesn't exist - no-op.
  • If the column's status is already "loading" or "loaded" - no-op.
  • If the column's status is "unknown" - sets it to "loading".

Trigger​

This action is emitted automatically by the render layer. It isn't typically dispatched manually, but can be:

api.exec("request-data", { id: "backlog" });

Observe​

Listen for the action and fetch cards from a backend:

api.on("request-data", ({ id }) => {
	fetch(`/api/columns/${id}/cards`)
		.then(res => res.json())
		.then(cards => api.exec("provide-data", { id, cards }));
});

Intercept​

api.intercept("request-data", ({ id }) => {
	// cancel the request for a specific column
	return id !== "archived";
});

Component handler​

<Kanban
  :dynamicData="true"
  :cards="[]"
  :columns="columns"
  :onrequestdata="({ id }) => {
    fetch(`/api/columns/${id}/cards`)
      .then(res => res.json())
      .then(cards => api.exec('provide-data', { id, cards }));
  }"
/>