useAttrs()

Accesses fallthrough attributes not declared as props.

Since Vue 3.0 Spec ↗

Syntax

const attrs = useAttrs()

Returns

object — Reactive object of non-prop attributes and listeners.

Examples

<script setup lang="ts">
import { useAttrs } from 'vue';

defineOptions({ inheritAttrs: false });
const attrs = useAttrs();
</script>

<template>
  <div class="wrapper">
    <input v-bind="attrs" />
  </div>
</template>

Notes

attrs contains any attributes/events passed by the parent that are not declared props (class, style, id, listeners, etc.). Set `inheritAttrs: false` and `v-bind="attrs"` to forward them to a specific inner element, common in wrapper components.