Omar Alves Omar Alves - 1 year ago 87
React JSX Question

Make react read a external variable defined outside the root component

I have a bundled React application loaded into a HTML by a tag. I would like to pass some initial data to this application and I would like to define this data in HTML or in some previously loaded javascript.

Any thoughts on how to accomplish that?


Answer Source

The react document have pretty clear example about this, see this tutorial

var PRODUCTS = [
  {category: 'Sporting Goods', price: '$49.99', stocked: true, name: 'Football'},
  {category: 'Sporting Goods', price: '$9.99', stocked: true, name: 'Baseball'},
  {category: 'Sporting Goods', price: '$29.99', stocked: false, name: 'Basketball'},
  {category: 'Electronics', price: '$99.99', stocked: true, name: 'iPod Touch'},
  {category: 'Electronics', price: '$399.99', stocked: false, name: 'iPhone 5'},
  {category: 'Electronics', price: '$199.99', stocked: true, name: 'Nexus 7'}

  <FilterableProductTable products={PRODUCTS} />,

Just notice that the variable must be loaded before calling to it, with correct scope.

Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download