Ant Design按钮点击后loading文字颜色与背景色一致实现教程

"Ant Design按钮点击后loading文字颜色与背景色一致实现教程"\n\n本文详细介绍了如何使用Ant Design的自定义样式，实现点击按钮后loading文字颜色与背景色一致的效果。提供了详细的步骤和示例代码，帮助开发者轻松解决按钮loading样式问题。\n\n首先，需要在项目中引入Ant Design的样式文件，然后可以在项目的样式文件中覆盖Ant Design的默认样式。\n\n以下是一个示例：\n\n1. 首先，安装Ant Design和less-loader：\n\nnpm install antd less less-loader\n\n\n2. 在项目中引入Ant Design的样式文件，可以在入口文件（通常是src/index.js或src/App.js）中添加以下代码：\njavascript\nimport \'antd/dist/antd.less\';\n\n\n3. 在项目的样式文件中，覆盖Ant Design的默认样式，可以使用以下代码：\ncss\n// index.less（或其他样式文件）\n@import \"~antd/dist/antd.less\";\n\n// 覆盖按钮的样式\n.ant-btn-loading {\n color: #fff; // 设置loading文字颜色为白色\n background-color: #ccc; // 设置背景色为灰色\n}\n\n\n4. 在组件中使用Ant Design的按钮，并添加loading属性：\njsx\nimport { Button } from \'antd\';\n\nfunction MyButton() {\n return (\n <Button type=\"primary\" loading>Click me</Button>\n );\n}\n\n\n这样，当按钮被点击后，loading文字的颜色将会与背景色一致。你可以根据需要调整文字颜色（color）和背景色（background-color）的值。