Usage Of getListUi Wire adapter

Let’s discuss here how to use the lightning/uiListApi Adapter to get the list view details. In Salesforce, we do have a different way to get the listview data using apex, soap API, rest API ext .. but in lightning, web component its makes more easy to access the Listview data using the getListUi wired adaptor. Wire adapters and JavaScript functions in these modules are built on top of Lightning Data Service (LDS) and User Interface API. Use these wire adapters and functions to work with Salesforce data and metadata.

getListUi 

Get the records and metadata for a list view. Use this wire adapter to get the records and metadata for a list view. The following example gets the list view records and metadata for a list view by API name.

  • objectApiName—(Required) The API name of a supported object.
  • listViewApiName—(Required) The API name of a list view, such as AllAccounts.
  • propertyOrFunction—A private property or function that receives the stream of data from the wire service. If a property is decorated with @wire, the results are returned to the property’s data property or error property. If a function is decorated with @wire, the results are returned in an object with a data property and an error property.

 

The flowing example will get the list view records and metadata for a list view by ID

The Following example Get list view records and metadata for an MRU list view by object

The Following example Get list views for an object

Create Lightning web Component 

create a lightning web component using the following SFDX command

Use the below ListUI.html markup code

 

Use the below ListUI.js code

use this ListUI.js-meta.xml mark up for configuration

 

 Push changes to scratch org.

Push changes to scratch using this command and add this component to record page using lighting app builder


You can able to see the output as shown below

 

Understand the code 

 

The Following code is used to get the list view data using the wired adaptor in JavaScript controller

You will be able to iterate the return result using the below template directives.