Рекурсивная карта с использованием Lodash - PullRequest
Новая
       6

Рекурсивная карта с использованием Lodash

0 голосов
/ 05 декабря 2018

У меня есть данные, которые должны быть рекурсивными, но я не знаю, как их реализовать.Вот мои данные.enter image description here

Все, что мне нужно сделать, это выглядеть так. 

[
      {
        id: 1,
        label: 'Satisfied customers',
        children: [
          {
            id: 2,
            label: 'Good food',
            icon: 'restaurant_menu',
            children: [

              { id: 3, label: 'Quality ingredients'},
              { id: 4, label: 'Good recipe' }
            ]
          },
          {
            id: 5,
            label: 'Good service',
            icon: 'room_service',
            children: [
              { id: 6, label: 'Prompt attention' },
              { id: 7, label: 'Professional waiter' }
            ]
          },
          {
            id: 8,
            label: 'Pleasant surroundings',
            icon: 'photo',
            children: [
              {
                id: 9,
                label: 'Happy atmosphere (not tickable)',
                tickable: false,
              },
              {
                id: 10,
                label: 'Good table presentation (disabled node)',
                disabled: true,
              },
              {
                id: 11,
                label: 'Pleasing decor',
              }
            ]
          },
          {
            id: 12,
            label: 'Extra information (has no tick)',
            noTick: true,
            icon: 'photo'
          },
          {
            id: 13,
            label: 'Forced tick strategy (to "strict" in this case)',
            tickStrategy: 'strict',
            icon: 'school',
            children: [
              {
                id: 14,
                label: 'Happy atmosphere',
              },
              {
                id: 15,
                label: 'Good table presentation',
              },
              {
                id: 16,
                label: 'Very pleasing decor',
              }
            ]
          }
        ]
      }
    ]

Мой код не работает ... это просто карта без каких-либорекурсия. 

categories.map(e => {
        console.log(e.all_children)
        return {
          id: e.id,
          label: e.name,
          children: _.values(e).map(v => {
              return { id: v.id, label: e.name }
          })
        }
      })

Я действительно не знаю, как это сделать.Если у вас есть идеи, как это сделать, пожалуйста, помогите мне.Я искал, как сделать это с помощью lodash, но я не могу найти соответствующий код.Я не очень хорош в JavaScript.

1 Ответ

0 голосов
/ 05 декабря 2018

Вам необходимо указать функцию для последующего отображения внутри обратного вызова. 

const
    map = e => ({
        id: e.id,
        label: e.name,
        children: e.all_children.map(map) // recursive call
    }),
    tree = categories.map(map);

Чтобы получить все свойства без all_children, вы можете взять остальные параметры ... длясвойства и отделить только дочерние свойства для рекурсивного отображения. 

const
    map = ({ all_children = [], ...o }) => ({
        ...o,
        children: all_children.map(map) // recursive call
    }),
    tree = categories.map(map);
...