react Material UI 版本5.12.2 如何通过ID控制Button组件背景色
时间: 2024-05-16 13:15:43 浏览: 154
你可以使用`makeStyles`函数来创建一个样式对象,并使用该对象中的`root`属性来设置`Button`组件的背景色。具体实现可以参考下面的代码示例:
```jsx
import { Button, makeStyles } from '@material-ui/core';
const useStyles = makeStyles({
root: {
backgroundColor: 'red', // 设置背景色为红色
},
});
function MyButton() {
const classes = useStyles();
return (
<Button id="my-button" className={classes.root}>
Click me!
</Button>
);
}
```
在上面的代码中,我们使用`makeStyles`函数创建了一个样式对象,并在其中定义了一个`root`属性,该属性设置了`Button`组件的背景色为红色。然后,我们在`MyButton`组件中使用该样式对象,并将其应用到`Button`组件的`className`属性中,从而实现了通过`id`控制`Button`组件背景色的效果。
阅读全文