Estensione dei componenti Web OmniStudio Lightning

Personalizzare il comportamento e lo stile di un'applicazione estendendo i componenti Web OmniStudio Lightning. Ad esempio, ignorare le proprietà, aggiungere altri componenti o inserire HTML.

Nota Se si disattiva Runtime pacchetto gestito in Imposta e si utilizza il runtime standard, si consiglia di non estendere componenti Web Lightning come Blocca o TypeAhead. La modifica di questi componenti può causare incompatibilità tra Omnistudio e Omnistudio per i pacchetti gestiti.

In questo esempio di codice, un componente Web Lightning personalizzato estende il componente Web Lightning pulsante. Sostituire la variabile spazio dei nomi nell'esempio di codice con lo spazio dei nomi del pacchetto Omnistudio in uso. Per OmniStudio in runtime standard, lo spazio dei nomi è omnistudio.

//.js

import Button from "namespace/button";

export default class buttonExtended extends Button {  
//override the property here so it gets triggered

    onclickbutton() {    
    this.label = "Button clicked";  

}}

//.js-meta.xml

<?xml version="1.0" encoding="UTF-8"?><LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata">
    <apiVersion>45.0</apiVersion>    
    <isExposed>true</isExposed>    
    <masterLabel>button_extended</masterLabel>    
    <description>Button extended</description>    
    <targets>      
        <target>lightning__RecordPage</target>      
        <target>lightning__AppPage</target>      
        <target>lightning__HomePage</target>  
    </targets>
    <runtimeNamespace>namespace</runtimeNamespace>
</LightningComponentBundle>

//.html

<template>
//add HTML here to override the template layout
</template>

//_slds.css

//add CSS to override or append the SLDS theme css
.slds-button {
    background: #cccccc;
    border-color: #dddddd;
}

Nota

I componenti Web Lightning personalizzati creati all'esterno del pacchetto non possono utilizzare alcun componente Web Salesforce Lightning che utilizza le risorse Salesforce o influisce sul componente in fase di esecuzione. Per ulteriori informazioni, vedere Moduli Salesforce.

Nota

I componenti Web Lightning personalizzati non generano errori a meno che non sia abilitata la modalità Debug. Per ulteriori informazioni, vedere Debug dei componenti Lightning Web.

1. Assicurarsi di avere l'Area di lavoro IDX o Salesforce DX configurato in locale. Per informazioni sull'impostazione di IDX Workbench o Salesforce DX, vedere Impostazione dei componenti Lightning Web.
2. Scegliere il componente che si desidera estendere. Per un elenco dei componenti Web Lightning, vedere Componenti Web Lightning OmniStudio.
3. Per creare un componente Web Lightning, accedere alla cartella Lwc nel progetto ed eseguire il comando lightning generate component Salesforce CLI. Ad esempio:

   sf lightning generate component --type lwc --name componentname_extended

   Per ulteriori informazioni sulla creazione di un componente Web Lightning, vedere Creazione di componenti Web Lightning. Per un elenco completo dei comandi Salesforce CLI disponibili, vedere Comandi Lightning.

4. Nel file JavaScript, importare ed estendere il componente Web Lightning. Vedere l'esempio di codice in questa pagina.
5. Per rendere il componente Web Lightning personalizzato compatibile con i componenti Web OmniStudio Lightning, è necessario impostare due tag di metadati nel file di configurazione XML:
   • Se Lightning Web Security (LWS) è disabilitato, aggiungere lo spazio dei nomi del pacchetto OmniStudio utilizzando il tag dei metadati runtimeNamespace. Vedere l'esempio di codice in questa pagina. Per ulteriori informazioni sulla ricerca dello spazio dei nomi del pacchetto, vedere Visualizzazione dello spazio dei nomi e della versione dei pacchetti gestiti.
     

     Importante Se LWS è abilitato, l'impostazione di runtimeNamespace nei componenti causa errori simili a "Impossibile utilizzare lo spazio dei nomi di runtime 'somename' nel modulo c-someComponentName". Per determinare se LWS è abilitato nell'organizzazione, vedere Abilitazione di Lightning Web Security in un'organizzazione.
   • Impostare il tag dei metadati isExposed su true. Vedere l'esempio di codice in questa pagina.
6. Abilitare un componente Web Lightning personalizzato per effettuare chiamate remote utilizzando l'utilità Azione comune. Vedere Effettuazione di chiamate remote tramite OmniScript dai componenti Web Lightning.