vue中，有什么方法可以实现在鼠标浮上元素之后，显示隐藏掉的文字

在 Vue 中，可以使用 `v-if` 或 `v-show` 指令来实现鼠标浮上元素之后显示隐藏掉的文字。

`v-if` 指令是根据表达式的值的真假来有条件地渲染元素，如果表达式的值为真，则渲染元素，否则不渲染。因此，可以通过监听元素的 `mouseenter` 和 `mouseleave` 事件，来动态改变表达式的值，从而在鼠标浮上元素之后显示隐藏掉的文字。例如：

<template>
  <div @mouseenter="showText" @mouseleave="hideText">
    <div v-if="isShow">这是显示的文字</div>
    <div v-else>这是隐藏的文字</div>
  </div>
</template>

<script>
export default {
  data() {
    return {
      isShow: false
    }
  },
  methods: {
    showText() {
      this.isShow = true
    },
    hideText() {
      this.isShow = false
    }
  }
}
</script>

`v-show` 指令也可以实现类似的效果，它也是根据表达式的值的真假来控制元素的显示和隐藏，但是它不会渲染多余的元素，只是通过 CSS 的 `display` 属性来隐藏和显示元素。因此，在使用 `v-show` 指令时，需要将隐藏的文字放在一个元素中，并且通过 CSS 来控制其隐藏和显示。例如：

<template>
  <div @mouseenter="showText" @mouseleave="hideText">
    <div>这是显示的文字</div>
    <div class="hidden-text" v-show="!isShow">这是隐藏的文字</div>
  </div>
</template>

<style>
.hidden-text {
  display: none;
}
</style>

<script>
export default {
  data() {
    return {
      isShow: false
    }
  },
  methods: {
    showText() {
      this.isShow = true
    },
    hideText() {
      this.isShow = false
    }
  }
}
</script>

以上两种方法可以根据实际需求选择其中一种来实现在鼠标浮上元素之后显示隐藏掉的文字。