可能有些同学不知道naiveui里面message怎么使用，首先我们在setup外面进行使用，比如我们需要在请求拦截进行响应。

在setup外进行使用

如果你想在 setup 外使用 useDialog、useMessage、useNotification、useLoadingBar，可以通过 createDiscreteApi 来构建对应的 API。

直接上代码，在请求的api中使用，代码如下：

//request.js
import { createDiscreteApi } from "naive-ui";
const { message } = createDiscreteApi(["message"]);
//

 if (response.data.code == 500) {
      // 错误弹窗提示
      message.error(response.data.msg);
    }

直接包裹使用

我们使用官方的案例，看了半天，先贴官方解释

如果你想使用信息，你需要把调用其方法的组件放在 n-message-provider 内部并且使用 useMessage 去获取 API。
如果你想知道如何在 setup 外使用，请参考页面最下方的 Q & A。

官方例子：

<!-- App.vue -->
<n-message-provider>
  <content />
</n-message-provider>

不少同学还是不知道咋用，往下看，复制粘贴就完事

App.vue

<script setup lang="ts">
import { NConfigProvider } from "naive-ui";//导入这个，message用法也是一样的
import { zhCN, dateZhCN } from "naive-ui";
</script>

<template>
  <n-config-provider :locale="zhCN" :date-locale="dateZhCN">
    <n-notification-provider>//这个
    <router-view v-slot="{ Component, route }">
      <transition :name:string="route.meta.transition || 'fade'">
        <component :is="Component"></component>
      </transition>
    </router-view>
   </n-notification-provider>
  </n-config-provider>
</template>

至于使用部分：

import { useMessage } from 'naive-ui'
const message = useMessage()
 message.warning('hello')