为什么 store.getState() 在 reduxjs/toolkit 中不更新

Question

有人知道为什么吗；useSelector"；hook，更新后的状态可用，但是store.getState((不更新？

import { createSlice } from '@reduxjs/toolkit'
const initialState = {
baseUrl: "http://example.com/" 
}
function changeToLocal(state) {
return {...state, baseUrl: "https://localhost:345345/"}
}
function changeToGlobal(state) {
return { ...state, baseUrl: "http://example.com/"}
}

const ApiConfig = createSlice({
name: 'changeBaseURL',
initialState,
reducers: {
changeToLocal,
changeToGlobal,
}
})
export const {
changeToLocal: changeToLocalAction,
changeToGlobal: changeToGlobalAction,
} = ApiConfig.actions
export default ApiConfig.reducer;

在这里调度之后，通过"；useSelector"；钩子，收到更新后的状态：

const Header = () => {
const dispatch = useDispatch())
const CurrentBaseURL= useSelector(state => state.changeBaseURL.baseUrl)
console.log("🚀 ~ file: header.jsx ~ line 11 ~ Header ~ CurrentBaseURL", CurrentBaseURL)
const changeBaseURl = (e) => {
if (e.target.value === "local") {
dispatch(changeToLocalAction())
} else if (e.target.value === "global"){
dispatch(changeToGlobalAction())
}
}
...

：

但当我想在APIConfig文件中使用更新后的baseURL时，我意识到它没有更新：

import { Toast } from '../../helpers/Toast';
import axios from 'axios';
import store from '../../redux/store';
import { useSelector } from 'react-redux';
const instance = axios.create({
baseURL: "htttp://example.com",
timeout: 10000,
headers: { "x-Custom-Header": "foobar" }
})
instance.interceptors.response.use(response => {
if (response.headers["token-user"]) {
localStorage.setItem("token", response.headers["token-user"]);
}
if (response.data && response.data.statusIcon && response.data.status) {
Toast(response.data.statusIcon, response.data.status);
}
return response;
}, err => {
const expectErrors = err.response && err.response > 400 && err.response.status < 500;
if (!expectErrors) {
console.log(err);
return Promise.reject(err);
});
export default instance;

上面的配置是这样使用的：

import Api from '../../../utils/request/api/Api'
export const GetDisposablePassword = (nationalCode) => {
return Api.post(`api/Auth/GetDisposablePassword`, { nationalCode })
};

有人知道答案或有更好的想法吗？

Answer 1

我的最佳猜测是，配置文件不是由存储提供程序包装的应用程序。

编辑-澄清：

const state = store.getState();

只能在由存储提供程序包装的应用程序中安装的组件内部使用。

由于你的.config文件没有被包装和装载在你的应用程序中，也没有被你的提供者包装，所以得到一个未定义的值是正常的。