naiveui 实现显示隐藏模态框

你可以使用 NaiveUI 来实现显示和隐藏模态框。首先，你需要引入 NaiveUI 组件库，并在你的项目中注册它们。然后，你可以使用 `NModal` 组件来创建模态框，并使用 `visible` 属性来控制其显示和隐藏。

下面是一个简单的示例代码：

<template>
  <div>
    <NButton @click="showModal">显示模态框</NButton>
    <NModal v-model:visible="modalVisible" title="模态框标题">
      <!-- 模态框内容 -->
    </NModal>
  </div>
</template>

<script>
import { ref } from 'vue';
import { NButton, NModal } from 'naive-ui';

export default {
  components: {
    NButton,
    NModal,
  },
  setup() {
    const modalVisible = ref(false);

    const showModal = () => {
      modalVisible.value = true;
    };

    return {
      modalVisible,
      showModal,
    };
  },
};
</script>

在上面的示例中，我们通过 `modalVisible` 变量来控制模态框的显示和隐藏。当点击按钮时，`showModal` 方法会将 `modalVisible` 设置为 `true`，从而显示模态框。你可以在模态框中放置任意内容。

希望这个示例对你有帮助！如果有任何问题，请随时提问。