当用户点击vue.js中的更多图标时，如何获取选项？

<template>
  <div>
    <i class="more-icon" @click="showOptions"></i>
    <!-- 其他内容 -->
  </div>
</template>

<script>
export default {
  methods: {
    showOptions() {
      // 在这里处理点击更多图标后的逻辑
    }
  }
}
</script>

<template>
  <div>
    <i class="more-icon" @click="showOptions"></i>
    <ul v-if="showOptions">
      <li>选项1</li>
      <li>选项2</li>
      <li>选项3</li>
    </ul>
    <!-- 其他内容 -->
  </div>
</template>

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

<template>
  <div>
    <i class="more-icon" @click="showOptions"></i>
    <ul v-if="showOptions">
      <li @click="handleOptionClick('选项1')">选项1</li>
      <li @click="handleOptionClick('选项2')">选项2</li>
      <li @click="handleOptionClick('选项3')">选项3</li>
    </ul>
    <!-- 其他内容 -->
  </div>
</template>

<script>
export default {
  data() {
    return {
      showOptions: false
    }
  },
  methods: {
    showOptions() {
      this.showOptions = true;
    },
    handleOptionClick(option) {
      // 在这里处理点击选项后的逻辑
      console.log('点击了选项：', option);
    }
  }
}
</script>