vant UI popUp 弹出层关闭按钮自定义

在 Vant UI 中，可以通过自定义弹出层的关闭按钮来实现您的需求。以下是一种常见的方法：

1. 使用 `close-icon` 插槽来自定义关闭按钮的内容。
2. 在弹出层组件（如 Popup）中添加 `<template v-slot:close-icon>` 标签，然后在该标签内部自定义关闭按钮的内容。

下面是一个示例代码：

<template>
  <Popup v-model="showPopup">
    <template v-slot:close-icon>
      <!-- 自定义关闭按钮的内容 -->
      <img src="custom-close-icon.png" @click="closePopup" />
    </template>
    <!-- 弹出层的内容 -->
    <div>弹出层内容</div>
  </Popup>
</template>

<script>
import { Popup } from 'vant';

export default {
  components: {
    Popup,
  },
  data() {
    return {
      showPopup: false,
    };
  },
  methods: {
    closePopup() {
      this.showPopup = false;
    },
  },
};
</script>

在上面的示例中，我们在 `<template v-slot:close-icon>` 中自定义了一个关闭按钮，当用户点击该按钮时，调用了 `closePopup` 方法来关闭弹出层。

您可以根据实际需求自定义关闭按钮的样式和行为。只需将自定义的关闭按钮内容放置在 `<template v-slot:close-icon>` 标签内，即可实现对关闭按钮的自定义。