Description
What problem does this feature solve?
There's a problem with current provide\inject behaviour when component provides the same key it injects. If you try to do that you'll inject the same value that is provided by the component. The problem with that is that it's impossible to override provisions in a single component, which makes nested provisions unnecessary complicated. In order to do that you'll have to split provide\inject into two components and somehow share or even duplicate data between these two components (usually by manually cycling through this.$parent chain).
A common example of deep provision are breadcrumbs:
export default {
provide() {
const breadcrumbs = [];
if (this.breadcrumbs) breadcrumbs = [...this.breadcrumbs];
breadcrumbs.push(this.$router.currentRoute)
return { breadcrumbs }
},
inject: ['breadcrumbs']
}This provision could be used on nested page components to automatically generate components for each route level.
The code above obviously doesn't work because injected and provided breadcrumbs would be equal.
It's also unclear for me what's the use-case for self-injection. If there's not such case I think self-injection can be safely prevented and at the same time open opportunities for cleaner provide\inject techniques.
What does the proposed API look like?
The suggestion is that self-injection should be prevented by default.