Question

有什么方法可以在我的redux reducer中使用自定义react钩子吗？

我想在开关的情况下调用getDistanceHandler（）或useGetDistance（），但是React告诉我不允许在函数组件主体之外使用钩子

在pastebin上查看代码：https://pastebin.com/jqhK9zee

import {
...
SET_FILTERS,
...
} from '../actions/lokale';
import Lokal from './../../models/lokal';
import useGetDistance from '../../handler/useGetDistance';

const initialState = {
...
filteredLokale: [],
...
};

const getDistanceHandler = useGetDistance();

const lokaleReducer = (state = initialState, action) => {
switch (action.type) {
    ...
    case SET_FILTERS:
        //TODO
        const filters = action.filter;
        const updatedFilteredLokale = state.lokale.filter((lokal) => {
            let bool = true;
            //Name
            if (filters[0]) {
                bool = lokal.name.toLowerCase().indexOf(filters[0].toLowerCase()) > -1;
            }
            //Category
            if (bool && filters[1]) {
                bool = lokal.category.toLowerCase().indexOf(filters[1].toLowerCase()) > -1;
            }

            if (bool && filters[2]) {
                getDistanceHandler(region.latitude, region.longitude).then((distance) => {
                   bool = distance <= filters[2];

                }); 
            }

            return bool;
        });
        return { ...state, filteredLokale: updatedFilteredLokale };

    ...
    default:
        return state;
}
};

export default lokaleReducer;

Answer 1

挂钩是一种React功能。它们使用React API，并且完全由React组件生命周期进行管理。在React组件中调用时，唯一执行任何种类的逻辑功能。试图在React组件之外使用钩子根本没有道理。

在redux reducer中使用自定义钩子

1 个答案: