如何在react组件的正常函数中从redux存储中获取更新状态

Question

我最近一直在使用react和redux toolkit。我刚刚遇到一个奇怪的问题。

我有一个反应组件ChatUI，里面有一个正常的javascript函数nextQue

nextQue Function
它有一个postAPI调用，然后将响应发送到还原器以更新messages状态

我想要mailTime函数中的最新消息数组，因为我必须发布它们。知道useSelector是同步的，确实给了我最新的messages阵列。但是，如果我在mailTime函数内外log和messages，我就无法在mailTime函数内获得最新的messages

以下是代码(您不必根据以下代码回答，您可以在全球范围内讨论解决此类问题的方法。(

const ChatUI = () => {
const dispatch = useDispatch();
const messages = useSelector((state) => state.msg.messages);
const [loading, setLoading] = useState(true);
const mailTime = () => {
// const requestOptions = {
//   method: "POST",
//   headers: { "Content-Type": "application/json" },
//   body: JSON.stringify({
//     data: messages,
//   }),
// };
// fetch(
//   "https://api-url",
//   requestOptions
// )
//   .then((res) => res.json())
//   .then((data) => {
//     console.log("datdat", data);
//   });
console.log("not latest", messages); //not getting the desired length
};
console.log("latest messages", messages); //getting the desired length
const nextQue = (message) => {
setLoading(true);
const requestOptions = {
method: "POST",
headers: { "Content-Type": "application/json" },
body: {details to be posted}
};
fetch(
"https://api-url",
requestOptions
)
.then((res) => res.json())
.then((data) => {
console.log("data...", data?.data[0]?.question);
dispatch(
msgActions.add({
meta_value: data?.data[0]?.question,
post_id: data?.data[0]?.id,
type: "bot",
})
);

if (!data?.data[0]?.id) {
setTimeout(() => {
setLoading(false);
console.log("messa", messages);
mailTime();
}, 1000);
}
});
};
return <></>
}

所以我知道这里发生了什么，但如果我能得到任何解决方案或提示的回复，那就太好了。如果我哪里错了，请纠正我。

Answer 1

如果你想直接从mailTime函数访问存储，你可以在组件内部使用const store = useStore()，然后在mailTime函数内部调用store.getState()来访问状态，但我认为这不是最好的解决方案。如果你需要做一些链式api请求，我会建议你把这个部分转移到中间件。