Expose internal async component loaded/delayed/error internal refs on component to allow actions to be performed when it's loaded
What problem does this feature solve?
When an async component is used as a child (the child component is not under your control) sometimes you need to perform actions from the parent when the component is loaded.
Related to #2671
What does the proposed API look like?
Expose internal async component loaded/delayed/error internal refs on component to allow actions to be performed when it's loaded
Can you give us a brief example of a specific use case? that would help understand the challenge better.
It looks like emitting events or hooking into the equivalent of @hook:created
or similar would also work
Yes, the equivalent of hook:created/mounted/...
would be nice also, but they would need a payload that specifies which component is processed (the main component or the placeholder/loading or error one)
At a framework level (quasar) we can receive custom components to be used for dialogs. The components have an interface that requires them to have a show method, but the component can be sync it async. When the wrapper dialog is mounted it tries to call the show method of the custom component, but it should do so once the component is mounted.
We can safely assume that the component is mounted in a nextTick after being loaded, so any notification of created/loaded or mounted would be good.
Cleaning up old issues....
at least the mounted
part of the requirement is achievable like this:
<myAsyncComponent @vue:mounted="handler">
Isn't it @vnode-mounted
/ onVnodeMounted?
https://github.com/vuejs/core/issues/3178
https://github.com/vuejs/core/issues/4345
The problem is we only have access to the wrapper, which emits mounted, but the async component is not known (loader/component)
See Playground
The event is correct as I wrote it, and it's being passed down to the actual component (see the delayed console log)