Composables

The composable provided by the module provides helpers to fetch page and menu data, handle errors, and render custom components.

useDrupalCe

This composable exports a collection of utilities to handle Drupal content and functionality.

Page Handling

  • fetchPage(path: string, query?: Object, errorHandler?: Function, skipProxy?: boolean) - Fetches a page by path
  • getPage() - Returns the current page state
  • usePageHead(page: Ref<any>, include?: Array<'title' | 'meta' | 'link' | 'jsonld'>) - Sets page head metadata from Drupal data
  • getPageLayout(page?: Ref<any>) - Gets current page layout name (defaults to 'default')
  • fetchMenu(name: string, options?: Object, errorHandler?: Function, skipProxy?: boolean) - Fetches a menu by name

Component Rendering

  • renderCustomElements(elements: string | object | Array) - Renders one or multiple custom elements from JSON data
  • resolveCustomElement(element: string) - Resolves a custom element name to a Vue component

Messages

  • getMessages() - Returns Drupal messages of the current page

API Utilities

  • $ceApi(options?: Object, skipProxy?: boolean) - Creates a configured fetch instance
  • useCeApi(path: string, options?: Object, passThroughHeaders?: boolean, skipProxy?: boolean) - Fetches data from Drupal CE API endpoint
  • getCeApiEndpoint(localize?: boolean) - Gets API endpoint with optional localization
  • getDrupalBaseUrl() - Gets configured Drupal base URL
  • getMenuBaseUrl() - Gets configured menu base URL

Example usage

The following example makes use of the fetchPage method to get the current page:

<script setup>
  const { fetchPage } = useDrupalCe()
  const page = await fetchPage(useRoute().path)
</script>
Edit this page on GitHub
Table of Contents