我在从CardMedia图片上的道具获取图片时遇到了一些麻烦:
<Card className={classes.card}> <CardMedia className={classes.img} image={this.props.recipe.thumbnail} /> <CardContent className={classes.content}> <Typography gutterBottom variant="headline" component="h2"> {this.props.recipe.title} </Typography> <Typography component="p"> {this.props.recipe.ingredients} </Typography> </CardContent> <CardActions> <Button href={this.props.recipe.href} Recipe </Button> </CardActions> </Card>
它只是不渲染所有图像。所有其他props值将按需渲染。同样作为Material UI,我在JS css上指定了CardMedia的高度。
有谁知道为什么会这样吗?
好的,有同样的问题。终于成功了。
const styles = { media: { height: 0, paddingTop: '56.25%', // 16:9, marginTop:'30' } }; <CardMedia className={classes.media} ***image={require('assets/img/bg2.jpg')}*** title="Contemplative Reptile" **style={styles.media}** />
您还可以检查:https : //codesandbox.io/s/9zqr09zqjo-无选项加载图像。图片位置在我本地