Блог

Существует компонент:

 const Navbar = ({...props}) => {
    const dispatch = useDispatch()
    const navigation = useSelector(state => state.navigation)
    const [nav] = navigation.navs.filter(nav => nav.slug === props.navGroup)
    
    useEffect(() => {
        dispatch(fetchNavigation());
    }, [dispatch])

    return (
        <nav className={styles.nav}>
            {nav
            ? nav.all_elements.map(link =>
                <Link 
                className={styles.navLink}
                to={link.url}
                key={link.id}
                >
                    {link.name}
                </Link>
            )
            : <div>Something else</div>
            }
        </nav>
    )
}
 

Редуктор:

 import { createSlice } from "@reduxjs/toolkit";
import { fetchNavigation } from "../services/fetchNavigation"

const initialState = {
    "count": 0,
    "next": null,
    "previous": null,
    "navs": [],
    "loaded": false
}

const navSlice = createSlice({
    name: 'navigation',
    initialState: initialState,
    extraReducers: {
        [fetchNavigation.fulfilled]: (state = initialState, action) => {
            state.count = action.payload.count;
            state.next = action.payload.next;
            state.previous = action.payload.previous;
            state.loaded = true
            state.navs = action.payload.results;
        }
    },
})
 

Асинхронное действие:

 import { createAsyncThunk } from "@reduxjs/toolkit";
import { instance } from "../../API/config"

export const fetchNavigation = createAsyncThunk(
    "navigation/fetchNavigation", async () => {
        const response = await instance.get(`nav/`)
        return response.data
    }
);
 

Проблема:

Я показываю компонент в верхнем и нижнем колонтитулах, поэтому он делает два запроса к API, как я могу проверить, что данные уже находятся в хранилище, прежде чем вызывать createAsyncThunk? Я попытался получить текущее состояние «загруженного» ключа через getState (), но он не изменяет начальное состояние перед запросом, поэтому ничего не вышло