react 全局挂载组件

最新推荐文章于 2025-01-21 00:35:01 发布

胖胖yl

最新推荐文章于 2025-01-21 00:35:01 发布

阅读量4.3k

点赞数 1

CC 4.0 BY-SA版权

本文链接：https://blog.csdn.net/yanglinlzw/article/details/119883923

本文介绍如何在React应用中将Ant Design的message组件进行全局挂载，并在其他文件通过挂载的$message函数调用API，展示了如何传递参数并实现消息提示。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

在index.js 文件中导入react需要挂载的组件


import message from 'antd'

// 全局挂载组件
React.$message = function (arg) {
// 默认部分参数
  const { type = 'success', content, duration = 1, onclose } = { ...arg }
  message[type](content, duration, onclose)
}

在其他js文件调用api组件

import React from  'react'

export default function index() {
// 调用挂载的api
 <Button onClick={() => {
	 React.$message({
	     type:'success',
	     content:'你好啊',
	     duration: 1,
	     onclose: () => {
	       console.log('onclose')
	     }
	   })
 }}>点击</Button>
}