試圖通過JSON對象REACTJS不工作

我開始涉足ReactJS，我試圖傳遞給我的標記一個JSON對象，然後我可以在UI中顯示它，但它一直說沒有找到該元素。對此有何幫助？或者爲什麼道具對象沒有JSON對象？在此先感謝試圖通過JSON對象REACTJS不工作

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') 
);

來源

2016-01-20 Jorge

A c ouple事情：

你傳遞一個數組作爲mp道具，但隨後嘗試訪問它像一個對象。
您需要從<img> src屬性刪除引號：
您需要訪問實際mp道具

僅供參考，我已經從您的代碼中創建了一個解決這些問題的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') 
);

來源

2016-01-20 20:47:50 rossipedia

謝謝！我想我正在讀的那個對象將在道具reactJS對象中可用，但似乎我甚至必須引用props.mp。感謝您的信息 – Jorge

您可以使用JSX傳播運算符來實現您想要的。有關更多信息，請參閱https://facebook.github.io/react/docs/jsx-spread.html。 –

我想暫時不要依靠一些外部庫，而是使用JavaScript手動執行所有操作。謝謝您的幫助 – Jorge

變化

<img src="{this.props.placementImage}" />

到

<img src={this.props.mp[index].placementImage} />

你必須通過他們爲對象{}不是「{}」

編輯：我沒注意到它是一個陣列

來源

2016-01-20 20:47:40

這是我的問題，除了那個.mp丟失之外，我還以爲它已經在道具對象中。謝謝 – Jorge

歡迎您。很高興它解決了。 –

試圖通過JSON對象REACTJS不工作

回答

相關問題