You can use “target” property of q-tooltip to attach tooltip to q-expansion-item icon. Set unique class on each q-expansion-item, then specify it as target in q-tooltip:
<q-expansion-item
:content-inset-level="0.3"
v-for="menuSection in menuSections"
v-bind:key="menuSection.title"
:icon="menuSection.icon"
:label="menuSection.title"
:class="`ei-${menuSection.title}`"
expand-separator
>
<q-tooltip anchor="top right" self="center middle" :target="`.ei-${menuSection.title} i`">{{ menuSection.title }}</q-tooltip>
<q-list>
<q-item clickable v-ripple v-for="item in menuSection.items" v-bind:key="item.link" :to="item.link" exact>
<q-item-section avatar>
<q-icon :name="item.icon" size="xs">
<q-tooltip anchor="top right" self="center middle">
{{ item.title }}
</q-tooltip>
</q-icon>
</q-item-section>
<q-item-section>
<q-item-label>{{ item.title }}</q-item-label>
</q-item-section>
</q-item>
</q-list>
</q-expansion-item>
See full example here:
https://github.com/slanatech/dashblocks/blob/master/src/demo/layouts/Default.vue#L48
Demo:
https://dashblocks.io/demo
Tooltips can be seen in expansion items in sidebar menu