Удалять из одного стейта и помещать удаленные значения в другой

Question

Всем привет. Очень нужна помощь. Задача - есть таблица, в ней выбираются чекбоксами строки, нажимается кнопка переместить - и эти значения удаляются из первой таблицы и кладутся во вторую.

дано: dirline, dirline2 - это два стейта
e.dirline_id = key( key это выбранный чекбокс, e.dirline_id - с сервака приходит изначально, он равен кею.

dirline = [{ e.dirline_id, value }, { e.dirline_id, value }, { e.dirline_id, value }]
dirline2 = []

Задача: удалять из dirline значения (объекты) по key, и перемещать их в dirline2. Вроде все просто, но додуматься не могу. Реализовал только удаление пока, и дальше не могу додуматься. Это работает на удаление как реализовать что бы не просто удалялось, а по задаче выше?

setDirline((prev) => prev.filter((e) => !+key.includes(e.dirline_id));

Буду благодарен за конкретный код, ибо с чужих слов не понимаю. Заранее спасибо с меня лайки!

const [dirlines, setDirlines] = useState<IDirline[]>([]);
const [dirlines2, setDirlines2] = useState<IDirline[]>([]);

onDelAndSentDirline2: (key) => {
  setDirlines((prev) => {
    const removed: any = [];
    const filtered = prev.filter((e) => {
      if (e.dirline_id === +key) {
        removed.push({ ...e });
        return false;
      }
      return true;
    });
    setDirlines2((prev2) => [...prev2, ...removed]);
    return filtered;
  });
  console.log(dirlines);
  console.log(dirlines2);
},

Answer 1

Судя по строке кода с key.includes (и утверждению что такое выражение работает) - значение key вероятнее всего является массивом, а не примитивом.
Если это верно, то обращаться с данным значением надо соответственно его типу (а не приводить его к числу унарным плюсом +key при сравнении):

onDelAndSentDirline2: (keys) => {
  const keysSet: any = new Set(keys.map(Number));       // преобразуем в список чисел (`Set` оптимизирован на чтение, это ускорит проверку по сравнению с `includes`)
  setDirlines((prev) => {
    const removed: any = [];
    const filtered = prev.filter((itm) => {
      if (!keysSet.has(+itm.dirline_id)) return true;   // если в списке такого id нет, оставляем объект (не переносим его в `dirline2`)
      removed.push({ ...itm });
      return false;
    });
    setDirlines2((prev2) => [...prev2, ...removed]);
    return filtered;
  });
  console.log(dirlines);
  console.log(dirlines2);
},

Если же аргументом передается строка с перечислением айди (это маловероятно, но все же у строк тоже есть метод includes) - то строку надо разбивать по разделителю, преобразуя в массив перед проверкой... иначе будет некорректный результат в ситуациях совпадения значения dirline_id с любым из десятичных разрядов числа в списке id (например, 1 и '4,8,16' => ложное совпадение).

БЛОГ НА HUSL

Удалять из одного стейта и помещать удаленные значения в другой

Ответы (1 шт):