獲取錯誤 - 對象作爲React子項無效

ChartProvider正根據配置文件生成圖表列表。我正在嘗試渲染MainComponent中的所有圖表。獲取錯誤 - 對象作爲React子項無效

我得到錯誤：「對象作爲React子元素無效（找到：帶有鍵{}的對象）如果您打算渲染一組子對象，請改爲使用數組，或者使用createFragment對象）來自React附加組件。「

MainComponent：

var React = require('React'); 
var Chart = require('ChartProvider'); 

var MainComponent = React.createClass({  
    render: function() { 
     return (
      <div> 
       {Chart} 
      </div> 
     ); 
    } 
});

ChartProvider.js

var item = config.wList.map(function(widget, index) {  
     return ( 
        <ChartComponent width="500px" height="400px"   
        options={{title: widget.title}} /> 
      );   
     }); 
module.exports = item ;

Config.js文件中包含的數據：

module.exports = { 
     wList : [ { 
      title : "Average(Kbps)", 
     }, { 
      title : "Average DL(Kbps)", 
     }, { 
      title : "DL", 
     }, 
     { 
      title : "Minutes",   
     }, { 
      title : "Cell",   
     }, { 
      title : "UL",  
     }] 
     };

來源

2016-11-10 user2194838

繼承人的作品筆，看看你能不能用叉子瑞普你的問題。 http://codepen.io/anon/pen/rWxyyv?editors=1010 – skav

@skav謝謝。現在沒有錯誤。 – user2194838

您從一個模塊通過module.exports出口，不module.export：

module.exports = item;

在您的代碼中，module.exports是一個空對象，它無法呈現並導致您看到的錯誤消息。

與此無關，您不要關閉您的<ChartComponent>。添加/到最終解決這個問題：

<ChartComponent width="500px" height="400px" options={{title: widget.title}} />

來源

2016-11-10 20:33:00 Timo

獲取錯誤 - 對象作爲React子項無效

回答

相關問題