【Vue3】【Naive UI】＜n-message＞标签

【VUE3】【Naive UI】＜NCard＞ 标签
【VUE3】【Naive UI】＜n-button＞ 标签
【VUE3】【Naive UI】＜a＞ 标签
【VUE3】【Naive UI】＜NDropdown＞ 标签
【VUE3】【Naive UI】＜n-upload＞标签
【VUE3】【Naive UI】＜n-message＞标签

在 Naive UI 中， 组件的使用通常是通过 useMessage 钩子来实现的。
这个钩子返回一个对象，该对象提供了多种方法（如 info, success, warning, error 等）用于显示不同类型的提示信息。
每个方法都可以接受一个配置对象作为参数，以自定义消息的行为和外观。
下面我将列出所有可用的参数，并为每个参数提供示例代码。

content (String | VNode)

这是消息的主要内容，可以是简单的字符串或 Vue 的虚拟节点（VNode）。

<script setup>
import { useMessage } from 'naive-ui';const message = useMessage();function showContent() {message.info({content: '这是一个简单的文本消息'});
}
</script><template><button @click="showContent">显示文本消息</button>
</template>

对于 VNode 内容：

<script setup>
import { h, useMessage } from 'naive-ui';const message = useMessage();function showVNodeContent() {message.info({content: h('span', { style: 'color: blue' }, '这是一段蓝色的文字')});
}
</script><template><button @click="showVNodeContent">显示VNode内容的消息</button>
</template>