在 React 中，可以通过绑定样式的方式实现切换主题改变组件样式的功能。具体实现步骤如下：

1. 定义样式

   在 LESS 或 CSS 文件中定义需要切换的样式，例如：

   // app.less
   .container {background-color: @primary-color;color: @text-color;
   }// dark.less
   .container {background-color: @dark-primary-color;color: @dark-text-color;
   }
   

   在这个示例代码中，定义了两种样式，分别为 app.less 和 dark.less，其中包含了 .container 样式类。

2. 在组件中定义状态

   在组件中使用 useState 定义一个名为 theme 的状态，用于保存当前主题：

   // App.js
   import React, { useState } from 'react';
   import './app.less';
   import './dark.less';function App() {const [theme, setTheme] = useState('app');const handleToggleTheme = () => {setTheme(theme === 'app' ? 'dark' : 'app');};return (<div className={theme}><button onClick={handleToggleTheme}>Toggle theme</button><div className="container">Hello, world!</div></div>);
   }export default App;
   

   在这个示例代码中，使用 useState 定义了一个名为 theme 的状态，初始值为 'app'，并使用 setTheme 方法在点击按钮时切换主题。

3. 绑定样式

   在组件中使用条件渲染，根据当前主题绑定对应的样式：

   <div className={theme === 'app' ? 'container app' : 'container dark'}>Hello, world!
   </div>
   

   在这个示例代码中，根据当前主题绑定对应的样式，如果主题为 'app'，则绑定 app.less 中的样式类，否则绑定 dark.less 中的样式类。

需要注意的是，在使用绑定样式的方式实现切换主题改变组件样式时，需要避免出现重复的样式定义或不必要的样式继承，以保证应用程序的可维护性和性能。