Reactjs 如何实现树状图

#1

RT
主要是我不知道reactjs是否可以嵌套组件 递归
形如：
var TreeItem = React.createClass({
render: function(){
return (




)
}
})
#2

是支持递归的，只不过生成jsx的时候要注意一些，jsx不支持js解析的说，写了个简单的例子

import React, {Component} from 'react';

export default class Tree extends Component {
    constructor(props) {
        super(props)
        this.state = {
            data: this.props.data || []
        }
    }

    markNode(data) {
        let nodes
        if (Object.prototype.toString.call(data) == "[object Array]") {
            nodes = data.map((v) => {
                let node = (<li key={this.count++}>{v.text}</li>)
                if (v.children && v.children.length) {
                    node = (<li key={this.count++}>
                            <span>{v.text}</span>
                            {this.markNode(v.children)}
                        </li>)
                }
                return node
            })
        }
        return (
            <ul>{nodes}</ul>
        )
    }

    render() {
        this.count = 0
        return this.markNode(this.state.data)
    }
}

调用方法

<Tree data={[
    {
        text: 'root',
        children: [
            {
                text: 'chlid1',
                children: [{
                    text: 'chlid3'
                }]
            }
        ]
    }
]}/>