Launch custom LWC from Quick Action using Lightning Component – User friendly Tech help

Problem- Using Quick Action to launch custom Lightning web components.

n

Solution:- 

n

    n

  • Create a Lightning component as a wrapper for Quick action, to launch in subTab by using Open SFDC interface.
  • n

n

({ n    init: function(component) {n        var workspaceAPI = component.find("workspace");n        workspaceAPI.getFocusedTabInfo().then(function(response) {n            workspaceAPI.openSubtab({n                parentTabId: response.tabId,n                pageReference: {n                    "type": "standard__component",n                    "attributes": {n                        "componentName": "c__customLWC" //Name of custom LWC followed by c__n                    },n                     "state": {n                        "c__recordId": component.get("v.recordId") //record id of project, need it inside custom lwcn                                }   n                },n                 focus: truen            }).then(function(subtabId) {n                console.log("The new subtab ID is:" + subtabId);n            }).catch(function(error) {n                console.log("error");n            });n        });n    }nn})

n

    n

  • Create quick action, which points to this Lightning component
  • n

  • Inject the custom lightning web component, to be launched from lighting component
  • n

  • Add lightning action to Page layout
  • n

Was this article helpful?
YesNo

Similar Posts