javascript - 试图传递 JSON 对象 REACTJS 不工作

Question

我开始参与 ReactJS，我试图将一个 JSON 对象传递给我的标签，这样我就可以在 UI 中显示它，但它一直说找不到该元素。有什么帮助吗？或者为什么 props 对象没有 JSON 对象？提前致谢

var CommentBox = React.createClass({
  render: function() {
    return (
        <div className="img-container">
            <img src="{this.props.placementImage}" />
        </div>
    );
  }
});

var MP = [
    {
        id: "MP1001",
        placementImage: "https://www.aexp-static.com/intl/uk/rwd/images/UKHP_CM_promo_3.png",
        dts: "forever",
        dte: "forever",
        status: "",
        isDefault: false
    }
];

ReactDOM.render(
        <CommentBox mp={MP}/>,
        document.getElementById('content')
);

Answer 1

几件事:

1. 您正在传递一个数组作为 mp prop，然后尝试像访问对象一样访问它。

2. 您需要从 <img> 中删除引号源属性:

3. 您需要访问实际的 mp Prop

作为引用，我根据您的代码创建了一个 JSBin 示例来修复这些问题:http://jsbin.com/bohoqa/edit?html,js,output

var CommentBox = React.createClass({
  render: function() {
    return (
        <div className="img-container">
            <img src={this.props.mp.placementImage} />
        </div>
    );
  }
});

var MP = [
    {
        id: "MP1001",
        placementImage: "https://www.aexp-static.com/intl/uk/rwd/images/UKHP_CM_promo_3.png",
        dts: "forever",
        dte: "forever",
        status: "",
        isDefault: false
    }
];

ReactDOM.render(
        <CommentBox mp={MP[0]}/>,
        document.getElementById('content')
);