Ask questionsProposal: Template inheritance using the slots mechanism
Within a large application that makes heavy use of inheritance and mixins, the lack of template inheritance causes much jumping through hoops. The rationale under #5401 is eloquently written and captures the gist of it, so I won't repeat it here.
My proposal for solving this issue is to simply extend upon the existing slots mechanism. That is (shamelessly copy/pasting from @simplesmiler's example under the issue above):
<!-- parent.vue --> <template> <div> <slot name="header"> <h3>Default header</h3> </slot> <slot><!-- yup, default --></slot> <slot name="body"> <p>Default body</p> </slot> <slot name="footer"> <!-- no footer by default --> </slot> </div> </template>
<!-- child.vue --> <template extends> <!-- here be magic --> This stuff <h2 slot="header">More pronounced header</h2> goes into <p slot="footer">Footer added by the child</p> the default slot. </template>
Thus the existing composition rules are preserved, while it feels natural to both Vue developers and people used to templates with block-based inheritance (like Django, Pug etc.)
The only rules are that
extendsattribute can be used only with single-file components,
<template extends>can allow multiple root elements.
<!-- generated by vue-issues. DO NOT REMOVE -->
Answer questions MannikJ
i don't think he knows what inheritance really is...
What does that refer to?