为什么 React strap 媒体对象不渲染图像答案

【问题标题】：Why the React strap media object doesn't render the image为什么 React strap 媒体对象不渲染图像
【发布时间】：2020-01-26 08:32:52
【问题描述】：

我是 React 新手，并尝试过构建一个简单的应用程序。另外，我在其中使用了 reactstrap。但它没有显示我放在public/assets/images 文件夹中的图像。我已经尝试了很多次，可能 Media 对象可能不兼容。

另外，我正在动态渲染图像项，它是一个放在src/shared/leader.js 中的数组。

这是包含数组的 leader.js 文件，格式为。

 {
    id: 0,
    name: 'Peter Pan',
    image: '/assets/images/alberto.png',
    designation: 'Chief Epicurious Officer',
    abbr: 'CEO',
    featured: false,
  },

接下来是我的函数 RenderLeader，它正在使用这个数组，但项目没有呈现。

function RenderLeader(leader){
    return(

        <Media tag="li" key={leader.id} className="col-12 mt-5" >
            <Media left middle>
                <Media style={imgStyle} object src={leader.image} alt={leader.name} />
            </Media>
            <Media body className="ml-5">
                <Media heading>{leader.name}</Media>
                <p>{leader.designation}</p>
            </Media>
        </Media>


    );
}

这是我调用这个函数的方式

    <RenderLeader item={props.leader} />

【问题讨论】：

标签： javascript reactjs reactstrap

【解决方案1】：

您传递的是 item 道具，而不是 leader 道具。将item={props.leader} 更改为leader={props.leader}，然后功能组件执行function RenderLeader({ leader })。

【讨论】：