core icon indicating copy to clipboard operation
core copied to clipboard

feat(runtime-core): directive install hook

Open lidlanca opened this issue 4 years ago • 3 comments

add install hook for custom directive.

functional directive vs install hook.

currently providing a function as a directive, registers the function for created and mounted hooks without a way to be called by other directive life cycle hooks, or knowing which hook invoked the function.

directives: {
   directiveA: directiveHook(){}
}

with install hook

install function allows for setting any of the available hooks.

example: installing a directive provided by parent

/**
 return { created, mounted, unmounted , ...} 
*/
function providedDirectiveInstall(binding){
  // we can't use inject() api but we can access via binding
  let providedDirectiveOptions = binding.instance.$.provides['someDirective']  
  return providedDirectiveOptions 
}

directives: {
   myProvidedDirective: { install: providedDirectiveInstall }
}

lidlanca avatar Aug 01 '21 20:08 lidlanca

This should go through an RFC in the rfcs repo.

Not sure if let providedDirectiveOptions = binding.instance.$.provides['someDirective'] is supported 🤔

posva avatar Aug 01 '21 22:08 posva

This should go through an RFC in the rfcs repo.

agreed

Not sure if let providedDirectiveOptions = binding.instance.$.provides['someDirective'] is supported 🤔

not sure what you mean by "supported", the functionality will work, however it was just an example for possible use case for having a hook that early in the directive life cycle.

ideally inject() would have been available in directive invocation, but that might require another rfc.

lidlanca avatar Aug 02 '21 08:08 lidlanca

RFC discussion https://github.com/vuejs/rfcs/discussions/367

lidlanca avatar Aug 02 '21 08:08 lidlanca