我正在创建一个滑块并使用 prop 向它添加数据。每个幻灯片 div 都有一个标题和一个描述。我还想为每个 div 提供不同的图像背景。是否可以使用 props 向 div 添加背景图像?
这是我的方法,但它不起作用:
const slideData = [
{
id: 1,
heading: "First Heading",
description: "A short description of the service goes here",
image: './images/candle.jpg'
},
{
id: 2,
heading: "Second Heading",
description: "A short description of the service goes here",
image: './images/candle.jpg'
},
{
id: 3,
heading: "Third Heading",
description: "A short description of the service goes here",
image: './images/candle.jpg'
},
{
id: 4,
heading: "Fourth Heading",
description: "A short description of the service goes here",
image: './images/candle.jpg'
}
]
export default slideData
和子组件
import React from 'react';
function Slide(props) {
return (
<div className="slide" style={{background: props.image}}>
<h3> { props.heading} </h3>
<p> { props.description} </p>
</div>
);
}
export default Slide;
慕标琳琳
相关分类