Реагируйте JS и Redux: useSelector () против useStore ()

Question

Я хотел бы знать, в чем разница между useSelector и UseStore. Есть ли какие-то преимущества в использовании одного вместо другого? Спасибо.

useSelector

  const { pages } = useSelector((state: RootState) => {
    return {
      pages: state.pages
    };
  });
  console.log(pages);

useStore

  const pageArrayTwo = useStore();
  const pageArray = pageArrayTwo.getState().pages;
  console.log(pageArray);

Одинаковый вывод в обоих случаях

[{…}]
0: {id: 1, title: "Use Redux", content: "Welcome"}
length: 1
__proto__: Array(0)

Answer 1

UseSelector, главное преимущество в том, что он делает поверхностное сравнение предыдущего результата селектора, таким образом, потенциально не повторяет рендеринг, если результат будет таким же.

Когда отправляется действие , useSelector() выполнит эталонное сравнение предыдущего значения результата селектора и текущего значения результата. Если они отличаются, компонент будет вынужден повторно выполнить рендеринг. Если они одинаковы, компонент не будет повторно визуализироваться.

useStore просто получает доступ к объекту хранилища, любые логи компонента c основаны на доступе к состоянию хранилища выиграно ' Эта проверка не принесет пользы. На самом деле, Redux даже рекомендует против , используя его для этой цели.

Этот хук, вероятно, не следует использовать часто. Предпочитайте useSelector() в качестве основного выбора. Однако это может быть полезно для менее распространенного сценария ios, для которого требуется доступ к магазину, например, для замены редукторов.

Answer 2

useSelector: Это простая функция, которая принимает функцию, которая принимает состояние в качестве аргумента и возвращает значение. Используется для получения одного значения из состояния. Может служить заменой для mapStateToProps.

useDispatch: возвращает ссылку на объект отправки. Он может служить заменой mapDispatchToProps.

useStore: возвращает экземпляр хранилища. Обычно не рекомендуется, потому что компонент, который использует это, не будет обновлен. В таком случае использование должно использовать ловушки реагирования, такие как useEffect, чтобы явно обновить компонент.

Пожалуйста, образец здесь, который размещен в другом экземпляре стека другой экземпляр stackoverflow