Svelte — сопоставление двух многомерных массивов

Admin Svelte

Сопоставление данных делать на бэкенде удобнее — не будет засорение кода на фронте. Также и для пользователя преимущества — результат появится на странице быстрее. Однако на фронте тоже можно сопоставлять данные двух многомерных массивов. Пример, как сопоставить два массива данных на Svelte.

Пускай мы получаем два массива данных:

let allOperations = getFetch('get-all-operations/');
let portfolio = getFetch('get-portfolio/');

Сопоставим имя из первого массива с именем во втором массиве непосредственно в таблице:

<div class="table">
    {#await allOperations}
    {:then allOperations}
        {#each allOperations as operation}
            <div class="cell">
                {#await portfolio}
                {:then portfolio}

                    {#each portfolio as share}
                        {#if operation.name === share.name}
                 <span>{share.price}</span>
                        {/if}
                    {/each}

                {/await}
            </div>
        {/each}
    {/await}
</div>

Что происходит выше:
#await allOperations — ждем получение первого массива данных с бэкенда
:then allOperations — если получены данные выше, то
#each allOperations as operation — разбиваем данные на составляющие

#await portfolio — аналогично ожидаем второй массив данных
:then portfolio — если получены данные выше, то
#each portfolio as share — разбиваем данные на составляющие

#if operation.name === share.name — перебираем оба массива данных, сравнивая в них имена. Если они совпадают выводим текущее значение одного из массивов.

Если вам пригодилась информация, вы можете поблагодарить автора сайта символическим пожертвованием:

Добавить комментарий

Напишите свой комментарий, если вам есть что добавить/поправить/спросить по теме текущей статьи:
"Svelte — сопоставление двух многомерных массивов"