How to render nested json respose in React ??

I have route to nested categories with children so how to render all categories with its children for example if I go to http://laravel.dev/categories i get json response

[
    {
        "id": 1,
        "title": "Game of Thrones",
        "slug": "game-of-thrones",
        "description": null,
        "active": 1,
        "count": 0,
        "_lft": 1,
        "_rgt": 8,
        "parent_id": null,
        "depth": 0,
        "children": [
            {
                "id": 6,
                "title": "Season 5",
                "slug": "season-5",
                "description": null,
                "active": 1,
                "count": 0,
                "_lft": 2,
                "_rgt": 5,
                "parent_id": 1,
                "depth": 1,
                "children": [
                    {
                        "id": 8,
                        "title": "The Wars To Come",
                        "slug": "the-wars-to-come",
                        "description": null,
                        "active": 1,
                        "count": 0,
                        "_lft": 3,
                        "_rgt": 4,
                        "parent_id": 6,
                        "depth": 2,
                        "children": []
                    }
                ]
            },
            {
                "id": 7,
                "title": "Season 4",
                "slug": "season-4",
                "description": null,
                "active": 1,
                "count": 0,
                "_lft": 6,
                "_rgt": 7,
                "parent_id": 1,
                "depth": 1,
                "children": []
            }
        ]
    },
    {
        "id": 3,
        "title": "The Walking Dead",
        "slug": "the-walking-dead",
        "description": null,
        "active": 1,
        "count": 0,
        "_lft": 9,
        "_rgt": 10,
        "parent_id": null,
        "depth": 0,
        "children": []
    }
]

now i know there is map option in React to render array but I get root level only and I should render children nodes to i should create some kind of loop if children node have something in it

var TreeNode = React.createClass({

    getInitialState: function() {

        return { tree: [] };

    },

    componentDidMount: function() {

        $.get(this.props.source, function(result) {

            var nodes;

            nodes = result;

            if (this.isMounted()) {

                this.setState({ tree: nodes });

            }
        }.bind(this));

    },

    render: function() {

        return (

            <div>

                <h4>Results from ajax</h4>

                {this.state.tree} //here i get json array

                <h4>Tree</h4>

                {this.state.tree.map(function(nodes) {
                    return <li key={nodes.id}>{nodes.title}</li>
                })}

            </div>

        );

    }

});


React.render(<TreeNode source="http://laravel.dev/categories" />, document.body);