问题描述
任何人都知道如何使用带有 v-button 的 text-truncate。我目前的尝试是这样的:
<v-menu
offset-y>
<template v-slot:activator="{on,attrs}">
<v-btn
text
v-bind="attrs"
v-on="on"
:max-width="150"
class="text-truncate"
><span class="text-truncate;max-width:150px">{{ userEmail }}</span></v-btn>
</template>
<v-list>
<v-list-item-group>
<v-list-item
v-for="(item,index) in personalMenuItems"
:key="index"
@click="item.action">
<v-list-item-title>{{ item.title }}</v-list-item-title>
</v-list-item>
</v-list-item-group>
</v-list>
</v-menu>
解决方法
确保您正确设置了最大宽度 style
...
<v-btn text v-bind="attrs"
v-on="on"
:max-width="150">
<span class="text-truncate" style="max-width:150px">{{ userEmail }}</span>
</v-btn>