Materialui-从哪里加载CSS类?第2部分 [英] Materialui - where to load CSS classes from? part2

问题描述

我开始学习Material UI-Grid.这是我最近提出的问题的跟进 Materialui-从何处加载CSS类? 询问在哪里定义Material ui引用的类，即classes.root

I m starting to learn Material UI - Grid. This is a followup to the recent question I had asked Materialui - where to load CSS classes from? asking where to define the classes referenced by Material ui, namely classes.root

这是完整的代码:

import React from "react";
import MenuIcon from "@material-ui/icons/Menu";

import {
  Button,
  Icon,
  makeStyles,
  Grid,
  IconButton,
  AppBar,
  Toolbar,
  Typography,
} from "@material-ui/core";


function Materialuig(){

const useStyles = makeStyles({
  root: {
    backgroundColor: "red",
    color: (props) => props.color,
  },
});
    const classes = useStyles(props);
    return (
        <div className={classes.root}>
            <Grid container spacing={3}>
                <Grid item xs={12}>
                    <Paper className={classes.paper}>xs=12</Paper>
                </Grid>
                <Grid item xs={6}>
                    <Paper className={classes.paper}>xs=6</Paper>
                </Grid>
                <Grid item xs={6}>
                    <Paper className={classes.paper}>xs=6</Paper>
                </Grid>
                <Grid item xs={3}>
                    <Paper className={classes.paper}>xs=3</Paper>
                </Grid>
                <Grid item xs={3}>
                    <Paper className={classes.paper}>xs=3</Paper>
                </Grid>
                <Grid item xs={3}>
                    <Paper className={classes.paper}>xs=3</Paper>
                </Grid>
                <Grid item xs={3}>
                    <Paper className={classes.paper}>xs=3</Paper>
                </Grid>
            </Grid>
        </div>
    );
}    
export default Materialuig;

推荐答案

您正在使用Paper组件，但是您没有导入它，因此它是未定义的.

You are using the Paper component, but you aren't importing it, thus it is undefined.

您可以通过将其添加到主Grid相同的方式导入它="nofollow noreferrer"> Material-UI导入列表:

You can import it in the same manner as Grid by adding it to your main list of Material-UI imports:

import {
  Button,
  Icon,
  makeStyles,
  Grid,
  Paper,
  IconButton,
  AppBar,
  Toolbar,
  Typography,
} from "@material-ui/core";

或者您可以将其导入如下:

import Paper from '@material-ui/core/Paper';

---

props是未定义的，因为您没有在任何地方声明它. 您需要

---

props is undefined because you aren't declaring it anywhere. You need

function Materialuig(props){

代替

function Materialuig(){

这篇关于Materialui-从哪里加载CSS类?第2部分的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！