New type of directive to enhance components

[Fuzzyma]

I often find myself wanting to add shared functionality to my components but the functionality is not specific to the component.
My last example was a validate functionality and I would have loved to so something along those lines:

<MyInput v-validate="[validator1, validator2]" v-model="foo" />

Basically, it should be called after rendering is done because you still want to manipulate the underlying dom (like a normal directive). However, this type of directive would want access to all props and attrs passed to the component as well so you could easily validate what was passed (in my example).

I really tried hard to hack this into how directives work atm but it's as good as impossible.

A as workaround you would usually do this:

watch(foo, (value) => {
  const error = validator(value)
  // show error somehow
})

But it requires installing loads of watchers / repetitive use of a composable.
A component directive that runs in the scope of the component it was passed on would solve this problem.