Область действия в Try / catch, без доступа к значению внешней переменной - PullRequest
Новая
       38

Область действия в Try / catch, без доступа к значению внешней переменной

0 голосов
/ 25 сентября 2019

Я пытаюсь реализовать «оптимистическое обновление» удаления с использованием функциональных компонентов React, но поскольку они не имеют функции обратного вызова, я ищу обходной путь.

Это код, который я имею правосейчас. 

let temporaryDatalist = props.dataList;

const removeItem = async itemKey => {
    const targetIndex = dataList.findIndex(item => item[itemsKey] === itemKey);

    const targetedItem = dataList[targetIndex];

    const filteredDataList = dataList.filter(
      item => item[itemsKey] !== itemKey
    );

    setDataList(filteredDataList);

    temporaryDatalist = [...filteredDataList];

    console.log('new value', temporaryDatalist.length)

    try {
      const response = await deleteHandler(itemKey);

      return response;

    } catch (e) {
      console.log('value if failed', temporaryDatalist.length, temporaryDatalist);

      const updatedList = [
        ...temporaryDatalist.slice(0, targetIndex),
        targetedItem,
        ...temporaryDatalist.slice(targetIndex)
      ];

      temporaryDatalist = [...updatedList];

      console.log('new value after failed', temporaryDatalist.length);

      setDataList(updatedList);
    }
  };

Дело в том, что это не работает, когда я пытался быстро удалить два элемента и оба не удаются.

Вот что я ожидал (с учетом props.dataList.length=== 10):

  1. Я удаляю первый элемент // new value 9
  2. Я удаляю второй элемент // new value 8
  3. Запрос не выполнен, поэтому он поступает вблок catch // value if failed 8

Вместо этого я вижу следующее:

  1. Я удаляю первый элемент // new value 9
  2. Я удаляю второй элемент // new value 8
  3. Запрос не выполнен, поэтому он входит в блок захвата // value if failed 9**

Итак, почему, когда он входит в блок захвата, ссылка на temporaryDatalistПеременная - это переменная блока try, а не переменная извне?

Спасибо!

...