Lightning Web Components Flashcards
What happens if you try to directly modify an object passed from a parent to a child?
An invalid mutation error is thrown.
True or false: bound properties in {} can contain spaces.
False.
What is the easiest way to work with Salesforce data in an LWC?
Use base Lightning components built on the Lightning Data Service (LDS).
Which property of an event includes any sent data?
detail
What is the syntax for loading the account object into a variable named ACCOUNT_OBJECT?
import ACCOUNT_OBJECT from “@salesforce/schema/Account”;
Which two properties does a record page provide?
recordId and objectApiName
How do you conditionally display content in an LWC?
Nest a template tag(s) with the lwcI:if={someProperty}. The lwc:elseif and lwc:else properties can also be used.
How would you reference a component named viewSource in markup?
<c-view-source>
How do you conditionally render markup in LWCs?
Use the lwc:if, lwc:elseif, and lwc:else attributes.
What is the preferred, and easiest way to work with data in an LWC?
Lightning Data Service.
In which directory are message channels stored?
force-app/main/default/messageChannels
What is the proper syntax to import a method named myMethod from MyClass as MY_METHOD?
import MY_METHOD from ‘@salesforce/apex/MyClass.myMethod;
What is a slot?
A placeholder for markup that a parent component passes into a component’s body.
What is the file name format for a message channel?
messageChannelName.messageChannel-meta.xml
Which method is used for dispatching events?
dispatchEvent()
Which decorator exposes a field as a public property?
@api
Which attribute is set to listen for an event on an input element?
onchange
True or false: if you write a setter for a public property, you must also write a getter.
True.
What would be the property syntax to import the method named queryAccounts that is marked @AuraEnabled and part of the class AccountListController into an LWC?
import queryAccounts from ‘@salesforce/apex/AccountListController.queryAccounts’;
Which decorator marks a field as public?
@api
True or false: an LWC folder and its file must have the same name, including capitalization and underscores.
True.
True or false: all fields are reactive.
True.
True or false: an LWC file/folder must begin with a lowercase letter.
True.
How do you control when Apex method invocation occurs in an LWC?
Call the method imperatively.
An array of Contact fields has been declared named FIELDS. What is the proper syntax to use these fields when wiring in to a property?
@wire(getRecord, {recordId: ‘$recordId’, fields: FIELDS})
What is the syntax to create a child component named myComponent and set a public property named myProperty to the value of a primitive named test?
<c-my-component my-property="test"><c-my-component>
What decorator must be used to call an Apex method from an LWC?
@AuraEnabled
What would the syntax be to define an iterator named it that iterates over an array named accounts?
<template iterator:it={accounts}>
What is required to expose an Apex method to an LWC?
The method must be static, either global or public, and annotated with the method @AuraEnabled.
What is the filename for a component configuration file for an LWC named myComponent?
myComponent.js-meta.xml
True or false: an Apex method that isn’t annotated with cacheable=true must be called imperatively.
True.
How do you make an LWC visible in an org?
In the metadata component file, set the <isExposed> attribute to true and create <target> attribute(s) nested inside a <targets> attribute to specify which types of pages the component be added to.</targets></target></isExposed>
Which properties does a wired property have by default?
data and error
What is the default namespace for custom Lightning Web Components?
c
Which base components handle working with Salesforce data?
lightning-record-form, lightning-record-edit-form, and lightning-record-view-form
From which module are Apex classes imported?
@salesforce/apex
Which event value determines whether or not the event can pass the shadow boundary?
composed
What are the parameters to the message channel’s publish function?
A message context, a message channel, and the message payload.
How do you send data when dispatching an event?
Include as the second argument to the CustomEvent constructor an object with a detail property equal to the data that you wish to send.
How do camel case component folder names map to markup?
Using kebab-case
What is the prefix for reactive variables?
$
Which suffix do message channels use when imported?
__c (though they are not custom objects)
From which module are message channels imported?
@salesforce/messageChannel
What is the syntax to conditionally render HTML in an LWC based upon the value of myBoolean being true?
<template lwc:if={myBoolean}></template>
What is the default namespace for base LWCs?
lightning
How do you use a lightning-record-form to create a record?
Leave out the record-id attribute.
From which module is track imported?
lwc
True or false: defining a setter method is required in LWCs.
False. Setter methods are optional.
True or false: all wire adapters respect object CRUD rules, field-level security, and sharing.
True.
Which lifecycle hook is called when every time a component renders (and rerenders)?
renderedCallback()
Which event value determines whether or not the event moves up through the DOM?
bubbles
From which module are static resources imported?
@salesforce/resourceUrl
What does it mean that fields are reactive in LWCs?
If a field is used in a template, or indirectly in a getter of a property that’s used in a template, the component rerenders when the property’s value changes.
What is the syntax to dispatch a custom event named “selected” and send this.contact.Id as data along with the event?
this.dispatchEvent(new CustomEvent(“selected”, {detail: this.contact.Id}));
How does the framework identify each item so that it can rerender only the item that changed?
Every item in a list is assigned a unique key, which must be a string or a number.
From where is the getRecord wire adapter imported?
‘lightning/uiRecordApi
What is the root tag in an LWC HTML file?
<template>
</template>
True or false: the value property of an input element is updated automatically on every change.
False.
How many SVG icons can you have per LWC?
One.
Which template directive allows you to access special behavior for a list such as the index of the item and whether or not the item is the first/last item in the list?
iterator
Which module is wire imported from?
lwc
Why would a template have nested <template> tags?</template>
To use directives, such as lwc:if, lwc:else, and for:each.
A parent component will contain a child component named myComponent. myComponent fires previous and next components, which are handled by the parent component methods previousHandler and nextHandler, respectively. What is the syntax to insert the child component?
<c-my-component onprevious={previousHandler} onnext={nextHandler}></c-my-component>
What is the syntax to call a method called myMethod in a child component named myComponent from a parent component?
this.template.querySelector(“c-my-component”).myMethod();
How do you call a method in a child component from a parent component?
Expose the method by decorating it with @api. Then, use thiss.template.querySelector to find the child component and call the method.
From which module are objects and fields loaded?
@salesforce/schema
What is the syntax to create a child component named myComponent and set a public property named myProperty to the value of an object named test?
<c-my-component><c-my-component></c-my-component>
</c-my-component>
What is the syntax to iterate over a property named contacts and to access the current item as contact?
<template for:each={contacts} for:item=”contact”>
Which lifecycle hook is called when a component is inserted into the DOM?
connectedCallback()
How does the custom LWC myComponent render in HTML?
<c-my-component>
</c-my-component>
Given an iterator named it that iterates over a property named accounts, how would you get the name property of the current account?
it.value.name
What is the preferred way to navigate programmatically from a LWC?
The Lightning Navigation Service.
What are the parameters given to the @wire annotation to call an Apex method?
The name of the Apex method and an object containing the parameters for the method.
Which wire adapter is used to get a record’s data?
getRecord
What is the base class for Lightning Web Components?
LightningElement
What are the parameters to the message channel’s subscribe method?
The message context, the name of the message channel, and a listener method that handles the published message.
How many decorators can a single property or function have?
One.
From which package is NavigationMixin imported?
lightning/navigation
Which module is imported to work with navigation in LWCs?
NavigationMixin
Which method is called to handle navigation in an LWC?
NavigationMixin.Navigate
What is the syntax to load the Account object’s name field as NAME_FIELD?
import NAME_FIELD from “@salesforce/schema/Account.Name”;
How do you get a recordId in an LWC?
Declare a recordId property and decorate it with @api. The flexipage will populate the recordId property.
What is the syntax to dispatch an event named “next”?
this.dispatchEvent(new CustomEvent(“next));
