UseSelector 返回我未定义

Question

一点背景：

我正在尝试将带有 redux 组件的类转换为 hooks 组件（老板命令），在此过程中我读到了一种将 mapStateToProps 转换为 useSelector 的方法，所以我试图给它去吧，但我最近遇到了问题

const favValues = useSelector(favourites => favourites.favValues);

相同的代码，以防书写不清楚。

因为它返回未定义。

我想真正的问题是我如何转换它

function mapStateToProps({ queryFilter, favourites }) {
    return {
      queryFilter : queryFilter,
      //Favourites:
      favValues : favourites.favValues,
      defaultGroup : favourites.defaultGroup,
      initialValues : favourites.initialValues,
      favouritesList : favourites.favouritesList,
      loadingFavValues : favourites.loadingFavValues,
      applyingFavValues : favourites.applyingFavValues,
    }
  }

致useSelector。

任何帮助或参考书目将不胜感激

Answer 1

如何使用 mapStateToProps

所以mapStateToProps 有state 作为参数。

通常我是这样写的：

function mapStateToProps (state) {
     return {
         favValues: state.favorites.favValues,
          // etc..
     }
}

你刚刚解构了它，但是这里的 state = { queryFilter, favorites}。

useSelector的使用方法

使用useSelector，它还在回调中接收状态，所以你的钩子应该是这样的：

const favorites = useSelector(state => state.favorites.favValues);

或者我假设您可以再次解构该状态，使其看起来像这样：

const favorites = useSelector(({favorites})=> favorites.favValues);