Переменная высота в CardMedia - PullRequest
0 голосов
/ 25 мая 2019

Я хочу создавать карты разной высоты, но одинаковой ширины, чтобы мои изображения не обрезались внутри карты.До сих пор я только узнал, как сделать CardMedias с фиксированными соотношениями с помощью jss.Кто-нибудь может указать мне, где я могу ввести код для изменения высоты изображения после загрузки изображения?

const styles = theme => ({
  root: {
    marginTop: 36
  },
  card: {
    margin: "auto",
    maxWidth: 540
  },
  media: {
    height: 0,
    paddingTop: "100%"
  }
});

 ...

  renderMedia() {
    if (!this.props.user.media.length) {
      return;
    }

    return this.props.user.media.map(media => {
      return (
        <Grid item xs={12}>
          <Card className={this.classes.card}>
            <CardMedia
              className={this.classes.media}
              image="https://picsum.photos/300/500"
            />
            <CardContent>
              <Typography variant="body2" color="textSecondary" component="p">
                {media.content}
              </Typography>
            </CardContent>
          </Card>
        </Grid>
      );
    });
  }
...