Получить данные массива, содержащего массив в реактивах - PullRequest
0 голосов
/ 22 декабря 2018

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

Итак, мы хотим создать условие, когда у нас есть данные во втором массиве.

Ниже приведен пример: https://stackblitz.com/edit/react-v9iknk

Это функция

getData = (menu) => {

     return <li className={menu.children !== undefined && menu.children.length > 0 ? 'nav-item ddfull subnav' : 'nav-item'}>
            <a href={menu.link} className="nav-link">{menu.name}</a>
            {(menu.children !== undefined && menu.children.length > 0) &&
                <div className="ddmenu">
                    <ul>
                        {
                            menu.children.map(data => {
                                return this.getData(data);
                            })
                        }

                    </ul>
                </div>
            }
            </li>

    }

Проблема с этой линией, когда яизмените его на:

 return <li className={menu.children.children !== undefined && menu.children.children.length > 0 ? 'nav-item ddfull subnav' : 'nav-item'}>

Ниже приведен формат JSON:

{ "name": "level1.3", "link": "#", 
      "children": [
        { "name": "level1.3.1", "link": "#", 
          "children": [
            { 
              "name": "level1.3.1.1", "link": "#" }
            ] 
        }, 
        { "name": "level1.3.1.2", "link": "#", 
      "children": [
        { "name": "level1.3.1.2", "link": "#" }
        ] }
        ] 
      }

Примечание: я пробовал следующее, потому что это массив внутри массива, а необъект, но получаю неопределенную ошибку

menu.children[0].children

1 Ответ

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

используйте оба условия menu.children !== undefined и menu.children[0].children !== undefined для проверки внутренних данных:

 <li className={(menu.children!== undefined && menu.children.length > 0  &&menu.children[0].children !== undefined && menu.children[0].children.length > 0)? 'nav-item ddfull subnav' : 'nav-item'}>

Вы также можете использовать метод get из lodash

...