As we all know that, salesforce has recently introduce new technology which is “Lightning Web Component” which have only 5 files in a folder that does not include design file like in Aura Component.
What if we wanted to get some input from the user before using our Web Components. No need to be panic we have meta.xml file where we can do the same trick.
We can define the targets where we wanted to use our lightning web components below are the list of the same targets and sample to use targets in meta file
<targets>
<target>lightning__AppPage</target>
<target>lightning__RecordPage</target>
<target>lightning__HomePage</target>
<target>lightningCommunity__Default</target>
<target>lightningCommunity__Page</target>
</targets>
lightning__AppPage :- Components can be used in App Page
lightning__RecordPage: – Component can be used in record detail page
lightning__HomePage: – Components can be used in App Home Page
lightningCommunity__Default:- Components can be used in community default page.
lightningCommunity__Page: – Component can be used in community as page.
Below is the code of the Web components for the design attribute
html file
<template>
<lightning-card title="Design attribute in Configuration file" icon-name="custom:custom45">
{recordId}
{heading}
</lightning-card>
</template>
javaScript file
import { LightningElement, api } from 'lwc';
export default class DesignAttribute extends LightningElement {
@api recordId;
@api heading = "default value";
}
XML file
<?xml version="1.0" encoding="UTF-8"?>
<LightningComponentBundle xmlns="http://soap.sforce.com/2006/04/metadata" >
<apiVersion>45.0</apiVersion>
<isExposed>true</isExposed>
<masterLabel>Design Attribute Demo</masterLabel>
<description>This is the demo Lightning Web Component which will give you the demo idea about the design attribute</description>
<targets>
<target>lightning__AppPage</target>
<target>lightning__RecordPage</target>
<target>lightning__HomePage</target>
<target>lightningCommunity__Default</target>
<target>lightningCommunity__Page</target>
</targets>
<targetConfigs>
<targetConfig targets="lightning__RecordPage">
<property name="recordId" type="String" />
<objects>
<object>Account</object>
<object>Contact</object>
<object>Opportunity</object>
</objects>
</targetConfig>
<targetConfig targets="lightning__AppPage">
<property name="heading" type="String" />
</targetConfig>
</targetConfigs>
</LightningComponentBundle>
Please find the recording for the same
Thanks for the reading! Sharing is caring 🙂 #BeaMultiplayer #Trailblazer #LightningWebComponents #WebComponentsSalesforce
If you have any queries you can reach me [email protected] or tweet me @cloudyamit
2 comments
How to provision for LIST Type or array type
Have you tried to create the array OR List and then tried using the same?