LoremPixel组件始终呈现相同的图像
瓦姆西安波卢
这是LoremPixel我构建的组件：
export default function LoremPixel({ url = 'http://lorempixel.com', width = 200, height = 400, alt = 'Placeholder image' }) {
const src = `${url}/${width}/${height}`;
return (<img className={centerImage} src={src} alt={alt} />);
}
const { string, number, oneOf } = PropTypes;
LoremPixel.propTypes = {
url: string,
height: oneOf(string, number),
width: oneOf(string, number),
alt: string,
};
我应该每次都获得宽度200和高度400的随机图像，但是我总是在所有LoremPixel组件中看到相同的图像。
我在我的组件中称呼它为：
return (
<Card containerStyle={containerStyle}>
<CardHeader
title={title}
style={headerRootStyle}
textStyle={cardHeaderTextStyle}
titleStyle={titleStyle}
/>
<span className={authorStyle}>{author}</span>
<CardMedia>
<LoremPixel width={200} height={100} />
</CardMedia>
<CardText style={textStyle}>
<LoremIpsum />
</CardText>
<CardActions style={actionsStyle}>
<FlatButton label="Buy Now" />
</CardActions>
</Card>
);
从Book组件中调用的Bookshelf组件中：
Books = books.map(book => (<div
key={uuid.v4()}
className={colFixedWidth}
{...firstChild}
{...secondChild}
>
<Book {...book} />
</div>),
);
Keammoort
我认为您由于缓存而获得了相同的图像。您可以将当前时间戳添加到url中，以避免出现这种情况：
const src = `${url}/${width}/${height}?t=${Date.now()}`;
本文收集自互联网，转载请注明来源。
如有侵权，请联系[email protected] 删除。
编辑于
相关文章
Related 相关文章
- 1
React Router始终呈现NotFound默认组件
- 2
React路由始终加载相同的组件
- 3
ReactJS Infinity滚动组件始终呈现新数据
- 4
iOS String.drawAtPoint始终以相同大小呈现
- 5
ReactJS如何在循环中记忆以呈现相同的组件
- 6
ReactJS如何在循环中记忆以呈现相同的组件
- 7
随机图像链接在元素列表中呈现相同的效果
- 8
所有屏幕上的图像大小始终相同
- 9
文本始终在图像的右侧对齐，并在左边距相同
- 10
如果React组件始终呈现null，还是应该使用函数，我应该使用它吗？
- 11
React测试库，动态导入和React Router DOM始终呈现未找到的组件
- 12
如何使子组件和父组件中的值始终保持相同？
- 13
Chrome 无法始终如一地呈现 CSS 遮罩图像
- 14
如何在与按钮元素相同的行上呈现个性化按钮组件
- 15
在特定路由更改上呈现具有某些状态属性更改的相同组件
- 16
对于始终在x轴上保持相同位置的组件的推荐布局？
- 17
对于始终在x轴上保持相同位置的组件的推荐布局？
- 18
Angular2组件未呈现，也无法手动键入链接，始终转到父路径
- 19
路线路径始终呈现
- 20
功能组件未呈现
- 21
组件未呈现/显示
- 22
组件未动态呈现
- 23
子组件未呈现
- 24
从带有文件URI的图库中选择时，Cordova相机插件始终返回相同的图像
- 25
使用Google Images API和CURL检索图像时，始终获得相同的链接
- 26
无论分辨率/比例如何，如何使图像始终位于完全相同的位置？
- 27
通过CSS旋转图像，但将其裁剪为始终相同的正方形
- 28
当所有相关配置都设置为“始终可更新”时，为什么ADF业务组件实体属性将呈现为“新时可更新”？
- 29
Blazor共享组件未呈现
我来说两句