How does Vue 3 handle multiple root nodes (Fragments) and what are the implications for attribute inheritance?

Vue 3 templates can have multiple root elements (Fragments), unlike Vue 2 which required exactly one root node.

<template>
  <header>...</header>
  <main>...</main>
  <footer>...</footer>
</template>

Implication: Vue automatically applies attribute fallthrough (non-prop attributes passed to a component, like class or id) to the single root element when there's only one. With multiple root nodes, Vue can't automatically determine where fallthrough attributes should go, so you must explicitly bind v-bind="$attrs" to the intended element, or disable inheritance with inheritAttrs: false and handle it manually.