1

我有一个简单的 React 网站，并且正在使用 withStyles 功能将样式传递给 material-ui Grid 元素。尝试direction: "column"在样式中使用时，我收到下面包含的错误消息。

这是一个 .jsx 文件。我通过指定类型找到了解决方法，但这仅适用于 TypeScript。

这是 App.jsx 文件：


const styles = theme => ({
    root: {
        direction: "column",
        justify: "center",
        alignItems: "center",
    },
});

function App(props) {

    return (
        <div>
            <Grid container className={props.classes.root} >
                <Typography variant="h2">
                    Test Website
                </Typography>
                <TextField
                    id="input-user"
                    label="User"
                    value={1}
                    margin="normal"
                    variant="outlined"
                />

            </Grid>
        </div>
    )

}

export default withStyles(styles)(App);

我收到的错误消息是这样的：

Argument of type '(theme: any) => { root: { direction: string; justify: string; alignItems: string; }; }' is not assignable to parameter of type 'Styles<Theme, {}, "root">'.
  Type '(theme: any) => { root: { direction: string; justify: string; alignItems: string; }; }' is not assignable to type 'StyleRulesCallback<Theme, {}, "root">'.
    Type '{ root: { direction: string; justify: string; alignItems: string; }; }' is not assignable to type 'Record<"root", CreateCSSProperties<{}> | ((props: {}) => CreateCSSProperties<{}>)>'.
      Types of property 'root' are incompatible.
        Type '{ direction: string; justify: string; alignItems: string; }' is not assignable to type 'CreateCSSProperties<{}> | ((props: {}) => CreateCSSProperties<{}>)'.
          Type '{ direction: string; justify: string; alignItems: string; }' is not assignable to type 'CreateCSSProperties<{}>'.
            Types of property 'direction' are incompatible.
              Type 'string' is not assignable to type '"-moz-initial" | "inherit" | "initial" | "revert" | "unset" | "ltr" | "rtl" | ((props: {}) => DirectionProperty)'.

感谢您的任何帮助。

4

2 回答 2

2

column这是因为属性中没有类型direction。它可以采用以下类型的字符串：

  • 升
  • rtl
  • 最初的
  • 继承
于 2019-06-28T14:28:10.577 回答
0

你也可以试试下面export default withStyles(styles as {})(App);这行救了我。

于 2020-02-04T15:31:15.633 回答