Lwc: Change the lifecycle hook names ConnectedCallback and DisconnectedCallback to Mounted and Unmounted

Created on 30 Jun 2020  路  1Comment  路  Source: salesforce/lwc

I really understand why you used ConnectedCallback and DisconnectedCallback names, but couldn't you change these method names to Mounted and Unmounted to make the framework easier? Vue Js is a good example of making a front-end framework easy to pickup, and I got the idea from there.

People who are familiar would Vue JS would learn lightning faster too. Increasing the adoption rate.

Most helpful comment

@AllanOricil, LWC (as its names indicates) is about web components. We follow the API of the web components, which is the standard implemented by browsers. If someone search for "mdn unmount" to try to see the standard documentation for this, you get nothing.

If someone is really really interested on using the VUE terminology, and structure, it is very likely that you can just create an abstraction on top of LWC to achieve this, e.g.:

export default class LWCAlaVue extends LightningElement {
    connectedCallback() {
         this.mount();
    }
    disconnectedCallback() {
         this.unmount();
    }
    mount() { /*default noop*/ }
    unmount() { /*default noop*/ }
}

And just extends that one instead of LightningElement, and you're all set :)

Closing this since we are not going to change the names in favor of a non-standard API.

>All comments

@AllanOricil, LWC (as its names indicates) is about web components. We follow the API of the web components, which is the standard implemented by browsers. If someone search for "mdn unmount" to try to see the standard documentation for this, you get nothing.

If someone is really really interested on using the VUE terminology, and structure, it is very likely that you can just create an abstraction on top of LWC to achieve this, e.g.:

export default class LWCAlaVue extends LightningElement {
    connectedCallback() {
         this.mount();
    }
    disconnectedCallback() {
         this.unmount();
    }
    mount() { /*default noop*/ }
    unmount() { /*default noop*/ }
}

And just extends that one instead of LightningElement, and you're all set :)

Closing this since we are not going to change the names in favor of a non-standard API.

Was this page helpful?
0 / 5 - 0 ratings