如果单击按钮，则切换 vuetify 图标

大佬教程收集整理的这篇文章主要介绍了如果单击按钮，则切换 vuetify 图标，大佬教程大佬觉得挺不错的，现在分享给大家，也给大家做个参考。

如何解决如果单击按钮，则切换 vuetify 图标？

我有一个 div，如果单击按钮，我想在其中切换图标：

<div>
  <v-btn
    v-if="play"
    icon
    @click="true"
  >
    <v-icon>mdi-volume-off</v-icon>
  </v-btn>
  <v-btn
    v-else
    icon
    @click="false"
  >
    <v-icon>mdi-volume-high</v-icon>
  </v-btn>
</div>

在我的数据中，我将 play 设置为 false：

  data () {
    play: false
  }

点击时切换图标我缺少什么？

解决方法

<div>
  <v-btn
    icon
    @click="toggleIsPlaying"
  >
    <v-icon v-if="isPlaying">mdi-volume-off</v-icon>
    <v-icon v-else>mdi-volume-high</v-icon>
  </v-btn>
</div>

data () {
   return {
     isPlaying: false
   }
},methods: {
   toggleIsPlaying() {
      this.isPlaying = !this.isPlaying;
   }
}

大佬总结

以上是大佬教程为你收集整理的如果单击按钮，则切换 vuetify 图标全部内容，希望文章能够帮你解决如果单击按钮，则切换 vuetify 图标所遇到的程序开发问题。

如果觉得大佬教程网站内容还不错，欢迎将大佬教程推荐给程序员好友。

本图文内容来源于网友网络收集整理提供，作为学习参考使用，版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ：384754419，请注明来意。