JSFiddle - React, Tailwind, and code Playground

by mojtaba

HTML

<div id="topMenu">
            
</div>

JavaScript

var obj = {
    "menu": [
        {
            "MenuId": 1,
            "MenuName": "Home",
            "MenuLink": null,
            "Action": null,
            "Controller": null,
            "ParentID": null,
            "SortOrder": 1,
            "ModuleId": null,
            "Menus": {
            }
        },
        {
            "MenuId": 2,
            "MenuName": "New Transaction",
            "MenuLink": null,
            "Action": null,
            "Controller": null,
            "ParentID": null,
            "SortOrder": 2,
            "ModuleId": null,
            "Menus": {
            }
        },
        {
            "MenuId": 3,
            "MenuName": "Portfolio",
            "MenuLink": null,
            "Action": null,
            "Controller": null,
            "ParentID": null,
            "SortOrder": 3,
            "ModuleId": null,
            "Menus": {
            }
        },
{
            "MenuId": 4,
            "MenuName": "Admin",
            "MenuLink": null,
            "Action": null,
            "Controller": null,
            "ParentID": null,
            "SortOrder": 7,
            "ModuleId": null,
            "Menus": [
                {
                    "MenuId": 7,
                    "MenuName": "Master",
                    "MenuLink": null,
                    "Action": null,
                    "Controller": null,
                    "ParentID": 6,
                    "SortOrder": 1,
                    "ModuleId": null,
                    "Menus": [

                        {
                            "MenuId": 9,
                            "MenuName": "Country",
                            "MenuLink": "/Country/Index",
                            "Action": "Index",
                            "Controller": "Countries",
                            "ParentID": 7,
                            "SortOrder": 2,
                            "ModuleId": null,
                            "Menus": {
                 ...