Open KermanX opened 7 months ago
This issue is stoping the following workaround (related to https://github.com/vuejs/core/issues/5002) from working, because children's created
is called before the parent's:
export function directiveProvide<T = unknown>(dir: DirectiveBinding<any>, key: InjectionKey<T> | string, value?: T) {
const instance = dir.instance?.$ as any
if (instance) {
let provides = instance.provides
const parentProvides = instance.parent?.provides
if (provides === parentProvides)
provides = instance.provides = Object.create(parentProvides)
provides[key as any] = value
}
}
This is currently a must to make v-click
and v-motion
work together in Slidev.
Vue version
3.4.16 (current)
Link to minimal reproduction
https://stackblitz.com/edit/vitejs-vite-ultd9j?file=src%2Fmain.js
Steps to reproduce
What is expected?
The
created
hook of custom directives should be first called inparent
, then inchild
.Otherwise, another custom directive hook which is first called in
parent
, then inchild
should be provided.To not break any existing code, I think a new hook should be added, or a workaround should be provided.
What is actually happening?
The
created
hook of components is first called inparent
, then inchild
.The
created
hook of directives is first called inchild
, then inparent
.This is inconsistent. And there isn't a custom directive hook that is first called in
parent
, then inchild
.System Info
Any additional comments?
Related code: https://github.com/vuejs/core/blob/13393308503cc6b32f6974999873427c5fd62fc0/packages/runtime-core/src/renderer.ts#L641-L660
It seems that the comment in L641-L642 says sometimes props rely on child content. However, I think for most custom directives, the order "first parent, then child" is more important. Maybe we can swap L641-L656 and L658-660 (for consistency with
'created'
component hook), and add a new hook'childCreated'
for directives that rely on child content.The custom directive hook which is first called in
parent
is useful in the Slidevv-click
system (https://github.com/slidevjs/slidev/pull/1279)