vue点击图标会变成另一个再次点击变回来

要实现点击图标变成另一个，再次点击变回来的效果，可以使用Vue的条件渲染和事件绑定。

首先，在Vue实例的data中定义一个变量，用于控制图标的显示状态：

data() {
  return {
    isIconClicked: false
  }
}

然后，在模板中使用条件渲染来根据isIconClicked的值显示不同的图标：

<template>
  <div>
    <i class="icon" :class="{ 'icon-clicked': isIconClicked }" @click="toggleIcon"></i>
  </div>
</template>

在上面的代码中，通过:class绑定了一个对象，当isIconClicked为true时，会添加一个名为"icon-clicked"的类，从而改变图标的样式。

最后，在methods中定义toggleIcon方法，用于切换isIconClicked的值：

methods: {
  toggleIcon() {
    this.isIconClicked = !this.isIconClicked;
  }
}

这样，当图标被点击时，toggleIcon方法会被调用，从而切换isIconClicked的值，进而改变图标的样式。

可以根据具体需求修改图标的class名和图标样式