Question

我正在尝试在随机分配颜色的v图标上放置工具提示。每当我将鼠标悬停在v图标上时，颜色都会改变。我只希望将颜色设置一次。我不希望每次将鼠标悬停在v图标上时颜色都会改变。有什么建议吗？

<v-tooltip bottom>
  <template #activator="{on}">
    <v-icon v-on="on" :color="getRandomColor()">mdi-close</v-icon>
  </template>
  <span>Some Tooltip text</span>
</v-tooltip>

Answer 1

我通过在Vue的data：部分中创建颜色数组并在那里生成随机颜色来解决此问题。然后，我将特定的数组索引称为彩色。像这样：

 data() {
   return {
     rColors: [getRandomColor(), getRandomColor()],
   }
 }
 <v-icon v-on="on" :color="rColors[0]">mdi-close</v-icon>

有没有一种方法可以避免通过在前面的代码中放置关键字来做到这一点？

类似

v-on:once="on" ?

工具提示期间的Vue槽激活器正在重新渲染我的V图标

1 个答案: