Svelte — фильтрация результатов таблицы

Admin Svelte

Как можно сделать фильтрацию таблицы на JavaScript и Svelte быстро и легко.

Имеем такие данные:

Данные на svelte получаются с бэка таким образом:

let deposits = [];
let depositsBackup = [];

onMount(async () => {
    getFetch('deposit/get-deposits/').then((r) => {
        deposits = r;
        depositsBackup = r;
    });
});

Про асинхронную загрузку данных на Svelte.

Создаем 2 ссылки. Одна будет показывать в таблице записи, где есть описание. Другая будет показывать снова все записи.

<div class="links" on:click={displayOnlyWithNotes}>Показать только с записями</div>
<div class="links" on:click={displayAllNotes}>Показать все</div>

И 2 метода к ним:

function displayOnlyWithNotes() {
    deposits = deposits.filter(el => el.description !== '');
}

function displayAllNotes() {
    deposits = depositsBackup;
}

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

Как сделать на фильтрации данных график.

У сайта нет цели самоокупаться, поэтому на сайте нет рекламы. Но если вам пригодилась информация, можете лайкнуть страницу, оставить комментарий или отправить мне подарок на чашечку кофе.

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

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