Salesforce lwc development workshops session #6
- 1. Salesforce LWC Development Workshops - Session #6 By Techila Global Services
- 2. Course Overview This is a series of sessions intended for developers who want to build components using Lightning Web Component framework. • We are going to cover the most common scenarios and terminologies used in LWC. • Also we will be building small real time project with LWC demonstrating the concepts of LWC.
- 3. Agenda • Component Lifecycle • Lifecycle Hooks
- 5. A lifecycle hook is a callback method triggered at a specific phase a components lifecycle. What is Lifecycle Hook?
- 6. 1. constructor() Created when the component is created. Can’t access the child elements, here as the flow is parent to child. The first statement must be call to the super() Properties are not passed yet Similar to the init handler in aura. Use case: Setting the default values. 2. connectedCallback() Called when the component is inserted into the DOM tree. Can’t access the child elements here as the flow is parent to child. Use case: To subscribe the event, load data for initialization. Lifecycle Hooks
- 7. 3. disconnectedCallback() Called when the component is removed from the DOM tree. Flows from parent to child. Use Case: Unsubscribe events. 4. renderedCallback() Called when the component is rerendered. This is called every time the component is rendered. Flows from child to parent. Use Case: Load styles, load scripts. Lifecycle Hooks
- 8. 5. render() This function is used to render different templates dynamically. Flows from parent to child. Use Case: Dynamically change the html contents. 6. errorCallback(error, stack) Called when there is any error in one of the lifecycle hooks of the component. This method has two arguments error and the stack. Use Case: Render error views and display errors occurred in the child elements. Lifecycle Hooks
- 9. Demo
- 10. Questions
- 11. Please follow us for updates : Techila Academy – https://techilaservices.com/academy/ Facebook – https://www.facebook.com/techilaservices Linkedin – https://www.linkedin.com/company/techila-global-services Whatsapp Group LWC – https://chat.whatsapp.com/EZ94iH5MQVWG2d1xrAYdUF
- 12. ● Component Lifecycle ● Lifecycle Hooks References