javascript - Getting error - Objects are not valid as a React child -


chartprovider generating list of charts acc config file. trying render charts in maincomponent.

i getting error: "objects not valid react child (found: object keys {}). if meant render collection of children, use array instead or wrap object using createfragment(object) react add-ons."

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 file contains data:

module.exports = {         wlist : [ {           title : "average(kbps)",         }, {           title : "average dl(kbps)",         }, {           title : "dl",         },          {           title : "minutes",                  }, {           title : "cell",                 }, {           title : "ul",               }]        }; 

you export module via module.exports, not module.export:

module.exports = item; 

in code, module.exports empty object, cannot rendered , leads error message seeing.


unrelated that, don't close <chartcomponent>. add / end fix this:

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

Comments

Popular posts from this blog

sql server - Cannot query correctly (MSSQL - PHP - JSON) -

php - trouble displaying mysqli database results in correct order -

C++ Linked List -