要保留 Semantic UI React 标签的形状,可以使用React.cloneElement方法来克隆标签,并添加新的属性。
下面是一个示例代码:
import React from 'react';
import { Button } from 'semantic-ui-react';
const ButtonWrapper = ({ shape, children }) => {
// 克隆 Button 标签,并添加新的属性
const clonedButton = React.cloneElement(children, { shape });
return (
{/* 原始 Button 标签 */}
{children}
{/* 克隆的 Button 标签 */}
{clonedButton}
);
};
const App = () => {
return (
);
};
export default App;
在上面的示例中,ButtonWrapper组件接受shape属性,并通过React.cloneElement方法克隆了Button标签,并添加了shape属性。最后,我们在App组件中使用ButtonWrapper组件包裹Button标签,并传递shape="circular"属性。
这样,我们就能够保留原始的Button标签形状,并通过克隆的Button标签来修改形状。