Reactjs 使用makeStyles的替代项设置类组件的样式

我看到了使用makeStyles钩子的示例，这样您就可以在材质设计中设置功能组件的样式。但是我使用的是类组件，所以不能使用钩子。我看到用于功能组件的代码如下所示：

    const useStyles = makeStyles((theme) => ({
    margin: {
    margin: theme.spacing(1),
    },
    }));

然后，对于return（）部分中的元素样式，它们执行如下操作：

className={classes.margin}

---

除了类组件，我如何做相同类型的事情？

对于类组件，您可以使用

和样式

包装器

import React, { Component } from "react";
import { withStyles } from "@material-ui/core/styles";

class App extends Component {
    render() {
        const { classes } = this.props;
        return <div className={classes.styledLine}>Styling using withStyles</div>;
    }
}

const useStyles = (theme) => ({
    styledLine: {
        color: "red"
    }
});

export default withStyles(useStyles)(App);

import React，{Component}来自“React”；
从“@material ui/core/styles”导入{withStyles}”；
类应用程序扩展组件{
render（）{
const{classes}=this.props；
使用withStyles返回样式；
}
}
const useStyles=（主题）=>({
样式线：{
颜色：“红色”
}
});
导出默认样式（useStyles）（应用程序）；

工作演示：-

---

您只需在外部样式表中使用

CSS

，然后导入itI，我正努力让它正常工作。错误消息显示“意外标记”，并在渲染后指向“const”。知道为什么吗？我不确定。我提供的演示效果很好。您的代码中是否遵循了与我在演示中相同的模式？请不要使用

makeStyles

我的道歉。我把常数放在返回之后，而不是之前。啊！非常感谢。现在都在工作。我已经花了好几天的时间想办法解决这个问题！！