react-json-stream

react > stream > json

Usage no npm install needed!

<script type="module">
  import reactJsonStream from 'https://cdn.skypack.dev/react-json-stream';
</script>

README

react-json-stream

install

npm install --save react-json-stream

example

var JSON = require('jsonstream2');
var React = require('react-json-stream');


var App = React.createClass({
  getInitialState: function() {
    return {
      i: 0
    };
  },
  componentDidMount: function() {
    this.interval = setInterval(this.tick, 500);
  },
  componentWillUnmount: function() {
    clearInterval(this.interval);
  },
  tick: function() {
    this.setState({
      i: this.state.i + 1
    });
  },
  render: function() {
    return (<ul>
      <li key='my-li'>{this.state.i}</li>
    </ul>);
  }
});

var str = React.render(React.createElement(App));
str.pipe(JSON.stringify()).pipe(process.stdout);

setTimeout(function() {
  React.unmountComponentAtNode(str);
}, 2000);
[{
  "children": [],
  "parent": "",
  "name": "ul",
  "id": ".0",
  "props": {},
  "content": null
}, {
  "children": [{
    "children": [],
    "parent": ".0",
    "name": "li",
    "id": ".0.$my-li",
    "props": {
      "key": "my-li"
    },
    "content": 1
  }],
  "parent": "",
  "name": "ul",
  "id": ".0",
  "props": {},
  "content": null
}, {
  "children": [{
    "children": [],
    "parent": ".0",
    "name": "li",
    "id": ".0.$my-li",
    "props": {
      "key": "my-li"
    },
    "content": 2
  }],
  "parent": "",
  "name": "ul",
  "id": ".0",
  "props": {},
  "content": null
}, {
  "children": [{
    "children": [],
    "parent": ".0",
    "name": "li",
    "id": ".0.$my-li",
    "props": {
      "key": "my-li"
    },
    "content": 3
  }],
  "parent": "",
  "name": "ul",
  "id": ".0",
  "props": {},
  "content": null
}]

license

BSD-3-Clause