Как обработать многомерный массив из jQuery Sortable (вложенный список)? - PullRequest
Новая
       25

Как обработать многомерный массив из jQuery Sortable (вложенный список)?

1 голос
/ 28 мая 2019

Я работаю с jQuery Sortable для создания некоторого блока кодов с вложенным списком (для цикла и функционального блока), затем я получил эту строку json, используя JSON.stringify для console.log (jsonString): 

{
  "codes": [
    [
      {
        "id": "code_run",
        "code": "run",
        "name": "code_when_run"
      },
      {
        "id": "",
        "code": "loop",
        "name": "code_block_repeat",
        "children": [
          [
            {
              "id": "",
              "code": "up",
              "name": "code_arrow_up"
            },
            {
              "id": "",
              "code": "up",
              "name": "code_arrow_up"
            }
          ]
        ]
      }
    ]
  ]
}

Вот мой код из примера сортировки jQuery: 

let oldContainer, codeBlockId, codeBlockItem;

$("ol.nest_workspace").sortable({
    group: 'nested',
    onDragStart: function ($item, container, _super) {
    // Duplicate items of the no drop area
    if(!container.options.drop)
      $item.clone().insertAfter($item);
    _super($item, container);
  },
    afterMove: function (placeholder, container) {

        if(oldContainer != container){
            if(oldContainer)
                oldContainer.el.removeClass("active");
            container.el.addClass("active");

            oldContainer = container;
        }
    },
    onDrop: function ($item, container, _super) {
        container.el.removeClass("active");

        $item.addClass("block_code_on_workspace");

        var data = group.sortable("serialize").get();

    var jsonString = JSON.stringify({"codes":data}, null, '\t');
        console.log(jsonString);
        _super($item, container);

    },


});

Как мне обработать подмассив (children [])?

Я планирую сделать все это блоком в виде реальных кодов, чтобы он мог выполняться с другой функцией.

Я могу ожидать, что при выводе текста будет напечатана какая-то функция, такая как moveUp () или если ее цикл с какой-то функцией внутри, тогда будет выглядеть так: 

for (var i = 0; i < 3; i++) { 
  moveUp();
}

Любая помощь или предложение было бы здорово, спасибо!

Ответы [ 2 ]

0 голосов
/ 29 мая 2019

Я нашел решение для моей проблемы, вот код: 

$("ol.nest_workspace").sortable({
    group: 'nested',
    onDragStart: function ($item, container, _super) {
    // Duplicate items of the no drop area
    if(!container.options.drop)
      $item.clone().insertAfter($item);
            if($item.hasClass('RepeatCode')){
                $item.attr('id','block_loop_function_drag');
            }
    _super($item, container);
  },
    afterMove: function (placeholder, container) {

        if(oldContainer != container){
            if(oldContainer)
                oldContainer.el.removeClass("active");
            container.el.addClass("active");

            oldContainer = container;
        }
    },
    onDrop: function ($item, container, _super) {
        $(".coding-script").empty();
        container.el.removeClass("active");

        $item.addClass("block_code_on_workspace");
        $hasID = document.getElementById('block_loop_function_drag');


        var data = group.sortable("serialize").get();
        // console.log(data);

        for(var i = 0; i < data[0].length; i++){

            if($hasID){
                $item.attr('id','block_loop_function_'+i+'');
            }

            var obj = data[0][i];
            if(obj.hasOwnProperty("children")){

                var objChildren = obj.children[0];

                console.log(obj.code +'-'+i);
                ConvertToCodeScripts(obj.code, i);

                for(var j = 0; j < objChildren.length; j++){
                    console.log('loop-'+i+'-'+objChildren[j].code);
                    ConvertToCodeScripts('loop-'+i+'-'+objChildren[j].code, i);
                }

            }
            else{
                console.log(obj.code);
                ConvertToCodeScripts(obj.code, i);
            }
            console.log('lha - '+i);
        }
        _super($item, container);

    },
});

Но дайте мне знать, если у вас, ребята, есть лучшее решение.

Приветствия

0 голосов
/ 28 мая 2019

Если ваша строка JSON всегда будет выглядеть следующим образом.Затем вы можете указать целевой массив «children» следующим образом.

Я написал эту кодовую базу только для того формата JSON, который у вас есть выше. 

const childrenArr = jsonString.codes[0][1].children;

На основе кода, который мы 'до тех пор, пока вы выполняете строковое преобразование данных, этот код должен работать.

var jsonString = JSON.stringify ({"codes": data}, null, '\ t'); console.log (jsonString), ChildrenArr = jsonString.codes [0] [1] .children;

...