inheritAttrs Control Attribute Fallthrough
Last updated: 2026-10-22
inheritAttrs Control Attribute Fallthrough
inheritAttrs: false stops undeclared attributes from landing on the root element, letting you forward them precisely.
| Group | Options: Composition & Misc |
|---|---|
| Kind | Option |
| Scope | Component |
| Vue Version | 3.0+ |
| SSR Support | Yes |
📝 Syntax
export default {
inheritAttrs: false,
template: "<div><input v-bind="$attrs"></div>"
}⚙️ Arguments
| value | Boolean (default true) |
|---|
Returns：No return value
▶ Example
Edit the code below and see the live result:
Output：
The placeholder and class land on the real input.💡 Key Points
💡 Tip Wrapper components commonly disable fallthrough and rebind $attrs.
ℹ️ Note Multi-root components never auto-forward — bind manually.
🏷️ Related Composition & Misc
💡 Related Cases
More case studies coming soon.
📚 Related Tutorials
❓ FAQ
Q Why does the root carry odd attributes?
A Default fallthrough of undeclared attributes.
Q Do multi-root components need it?
A No, but you must bind $attrs manually or attributes are lost.
Q Does class count?
A Yes — class and style merge.
