reactjs - TypeError withstyles is not a function react export default
问题描述
我正在尝试从 material-ui 导入 withstyles,然后使用默认功能 withstyles 但总是有相同的错误。
import { withStyles } from "material-ui/styles/withStyles";
import { loginPageStyle } from "../assets/jss/material-kit-react/views/loginPage.jsx";
export default withStyles(loginPageStyle)(LoginPage);
在这里你可以看到错误。我尝试使用 chrome 控制台进行调试,但还没有找到任何解决方案。
使用 "material-ui": "1.0.0-beta.45" 那是 loginPageStyle.. 这是 material-kit 的一个例子
import { container } from "../../material-kit-react.jsx";
const signupPageStyle = {
container: {
...container,
zIndex: "2",
position: "relative",
paddingTop: "20vh",
color: "#FFFFFF"
},
cardHidden: {
opacity: "0",
transform: "translate3d(0, -60px, 0)"
},
pageHeader: {
minHeight: "100vh",
height: "auto",
display: "inherit",
position: "relative",
margin: "0",
padding: "0",
border: "0",
alignItems: "center",
"&:before": {
background: "rgba(0, 0, 0, 0.5)"
},
"&:before,&:after": {
position: "absolute",
zIndex: "1",
width: "100%",
height: "100%",
display: "block",
left: "0",
top: "0",
content: '""'
}
},
form: {
margin: "0"
},
cardHeader: {
width: "auto",
textAlign: "center",
marginLeft: "20px",
marginRight: "20px",
marginTop: "-40px",
padding: "20px 0",
marginBottom: "15px",
},
socialIcons: {
maxWidth: "24px",
marginTop: "0",
width: "100%",
transform: "none",
left: "0",
top: "0",
height: "100%",
lineHeight: "41px",
fontSize: "20px"
},
divider: {
marginTop: "30px",
marginBottom: "0px",
textAlign: "center"
},
cardFooter: {
paddingTop: "0rem",
border: "0",
borderRadius: "6px",
justifyContent: "center !important"
},
socialLine: {
marginTop: "1rem",
textAlign: "center",
padding: "0",
},
inputIconsColor: {
color: "#495057",
}
};
export default signupPageStyle;
解决方案
像 import { withStyles } from '@material-ui/core/styles' 一样导入;
推荐阅读
- javascript - 让 YouTube 播放数组中的随机视频
- html - 如何将图标添加到文本输入字段但保持背景颜色为白色?
- youtube-api - YouTube:请求无法完成,因为您已超出配额
- powershell - 如何在 PowerShell 脚本中使用命名参数和未命名参数?
- c# - 从 C# 将布尔值传递给 View
- docker - 有没有办法使用现有的 Docker Image 创建 NuxtJS 应用程序而不使用 npm create-app 命令
- shell - 在 bash shell 脚本中将字符串与文字连接起来
- android - android项目中项目级gradle文件中的google()和mavenCentral()有什么区别?
- html - 在 img 上居中 h5。目前正试图将“最热门的项目”放在我的图像上。图像和每个 div 将是垂直的
- amazon-web-services - 所有 ec2 实例的单一 IP 地址