动态的生成嵌套型组件

不可行，下面的内容不要参考了

场景

现在有一个json型的数据，比如导航栏的数据，以树状的形式分布，我们需要拿到数据后动态的生成DOM

思路

很容易想到递归的方式去渲染，但是ES6的奇葩语法让我十分头疼，我想一次生成标签并返回

第一次尝试

用js语句做判断条件来动态生成标签
代码大概是这样的

let Options = data.map(function(data){
    var temp = data.fullpath.substring(0,data.fullpath.length - data.name.length);
    if ((data.isServiceUnit == 0) && fun1(temp,path))  
        count++;
        path=temp;
        result = result + ""+data.name+">\n"
//      return (
//          {data.name}}>
//      );
    
    if (data.isServiceUnit == 0) {
        path=temp;
        for(var i = 0;i\n";
//      data_temp.map(function(data2){
//          return ()
//      })
        count = 0;
    }
    if (data.isServiceUnit == 1){
        result = result + ""+data.name+""
//      return (
//          {data.name}
//      )
    }
    else return;

}

经实践这样是行不通的，因为是嵌套标签，有时候一次return 返回的标签并不完整，所以编译器会报错，我自己想想这样的实现方式都奇葩，放弃。

第二次尝试

React 的官方文档中有一个这样的方法
dangerouslySetInnerHTML
经过我的实验，此方法可行

解决方法

先把json数据拿过来生成嵌套好的字符串，再用上面的方法一次性导入，就避开了上面的大坑。

这应该不是最好的解决方案，但至少解决了我的问题，在此分享一下，有更好的解决方法欢迎提出！