emberjs
Better docs around `init` lifecycle hook in components
The component lifecycle guide is missing a core hook in terms of init:
https://guides.emberjs.com/v2.14.0/components/the-component-lifecycle/
Since it's an inherited method from Ember.Object, the init function doesn't have docs on this page (even though it is listed as part of the lifecycle.
To existing Ember devs this may seem like a no brainer, but there are important details that are different for components:
- Does the component have access to passed in attribute values
- Will
initbe called for every component or just the first instance
Covering these clearly I think will better clarify the difference between using init and didReceiveAttrs for component initialization.
but there are important details that are different for components
Different how?
Objects don't have attributes (passed in by HBS templates) and "same as objects" could be said about controllers, but controllers act as singletons so things should be clarified for the use case to be more understandable to newcomers.
I fixed attrs. Here's an example that is unique to components in a way that should be explained in the lifecycle hooks and can't just be labeled as "it's just like Ember.Object":
https://ember-twiddle.com/bae3061e207b436b4395d67d7534a0c5?openFiles=components.my-component.js%2Ctemplates.components.my-component.hbs
// my-component.js
import Ember from 'ember';
export default Ember.Component.extend({
init() {
console.log(arguments);
// Where is this getting set???
console.log(this.get('hi'));
this._super(...arguments);
}
});
The invoking HBS is:
{{my-component hi="world"}}
The issue is that it is unclear to readers that hi is already set in init.
Especially with the naming of didReceiveAtrrs it would make sense to devs that hi would not be available until the didReceiveAtrrs hook runs.
@rtablada Is having attributes already set in init documented anywhere else? It may not be public api.
@Gaurav0 thanks for pinging me on this one. This PR has gotten way out of date, but is still needed.
Yeah component initialization is like calling MyComponent.create(attrs) in a way.
We shouldn't assume that people reading the component docs know how Ember.Object works.
