这是指向错误的屏幕截图的链接:https://drive.google.com/open?id=1Hl-fy1m4thp9qmupt88pzofi10ahhem-。
这是使用颜色的代码部分。
const theme = createMuiTheme({
palette: {
primary: {
light: '#33c9dc',
main: '#00bcd4',
dark: '#008394',
contrastText: '#fff'
},
secondary: {
light: '#ff6333',
main: '#ff3d00',
dark: '#b22a00',
contrastText: '#fff'
}
},
typography: {
useNextVariants: true
},
form: {
textAlign: "center"
},
image: {
margin: "10px auto 10px auto"
},
pageTitle: {
margin: "10px auto 10px auto"
},
textField: {
margin: "10px auto 10px auto"
},
button: {
marginTop: 20,
position: "relative"
},
customError: {
color: "red",
fontSize: "0.8rem",
marginTop: 5
},
progress: {
position: "absolute"
}
});
我已经尝试将颜色从十六进制更改为RGB值,它不起作用。
我对此问题的解决方案是将所有样式对象放在另一个对象中,将(调色板(对象丢弃,而仅分散不包含(Palette(
const theme = createMuiTheme({
palette: {
primary: {
light: '#33c9dc',
main: '#00bcd4',
dark: '#008394',
contrastText: '#fff'
},
secondary: {
light: '#ff6333',
main: '#ff3d00',
dark: '#b22a00',
contrastText: '#fff'
}
},
// the object to be spread
spreadThis: {
typography: {
useNextVariants: true
},
form: {
textAlign: "center"
},
image: {
margin: "10px auto 10px auto"
},
pageTitle: {
margin: "10px auto 10px auto"
},
textField: {
margin: "10px auto 10px auto"
},
button: {
marginTop: 20,
position: "relative"
},
customError: {
color: "red",
fontSize: "0.8rem",
marginTop: 5
},
progress: {
position: "absolute"
}
}
});
现在您将在样式对象中进行此操作
const style = theme => ({
...theme.spreadThis
});
希望这也对您有用!祝你好运
在我的情况下,我的调色板中有一个空的对象:
export default {
breakpoints: {...},
text: {
primary: "rgba(0, 0, 0, 0.87)",
secondary: "rgba(0, 0, 0, 0.54)",
disabled: "rgba(0, 0, 0, 0.38)",
hint: "rgba(0, 0, 0, 0.38)"},
divider: {}, // This was the issue, Either remove or put values in
background: {
paper: "#fff",
default: "#fafafa",
test: "#616161"
},
};
它并没有以任何方式影响任何核心,样式或图标库,但是我遇到了与您相同的错误!删除此问题为我解决了问题。