如何将.json文档中的样式属性导入react组件



我想做的是将宽度、高度和样式属性导入react组件。首先,我将展示带有对象属性的.json文档:

"manufacturerData": {
"name": "Duesenberg",
"articleCount": 0,
"image": {
"file": "duesenberg.jpg",
"width": "140",
"height": "52",
"exists": true
}
},

我想将样式:宽度高度导入到我的图像卡容器中,如下所示:

return (
<Card className='my-3 p-3 thumbnail' style={{ width: '14rem' }}>
<a href={`/articles/${articles.id}`}>
<Card.Img src={`/images/${articles.image.file}`} variat='top' />
</a>
</Card>
)

我似乎在网上找不到任何关于如何直接完成这项工作的信息。我非常感谢你的帮助。

return (
// by default 'px' units will be assumed. You can add any other unit explicitly
<Card className='my-3 p-3 thumbnail' style={{ width: articles.image.width }}>
// <Card className='my-3 p-3 thumbnail' style={{ width: `${articles.image.width}rem` }}>
<a href={`/articles/${articles.id}`}>
<Card.Img src={`/images/${articles.image.file}`} variat='top' />
</a>
</Card>
)

最新更新