TypeScript React 电子商务应用程序中的异步方法:对话创建和消息发送问题

问题描述 投票:0回答:1

我正在使用 Java Spring Boot 和 PostgreSQL 开发 TypeScript React 电子商务平台。当用户提交表单时,它应该与管理员创建一个对话,并在该对话中将表单作为消息发送。但是,似乎当创建对话实体时,在应用程序尝试发送消息之前它尚未保存在数据库中。结果,后端报告该消息没有关联的对话。

以下是相关代码片段:

const sendBuildAsMessage = async (formData: any) => {
    try {
        if (!currentUser) return;

        // Ensure conversation creation before sending message
        await createConversationForNewUser();

        // Wait for conversations state to update
        await new Promise(resolve => setTimeout(resolve, 100));

        const messageContent = `${objectToString(formData)}`;

        // Use the first conversation after creation
        const activeConv = conversations[0];

        if (!activeConv) {
            console.log("No active conversation found");
            return;
        }

        await sendMessage({
            sender: currentUser,
            content: messageContent,
            timestamp: new Date().toISOString(),
            conversation: activeConv,
        });

        enqueueSnackbar("Build sent as message", { variant: "success" });
    } catch (error) {
        console.error("Failed to send build as message:", error);
        enqueueSnackbar("Failed to send build as message", { variant: "error" });
    }
};

const createConversationForNewUser = async () => {
    try {
        let conversation: Conversation = {
            client: currentUser!,
            admin: currentUserAdmin!,
        };

        await createConversation(conversation);

        const response = await getUserConversations(parseInt(userId!));
        setConversations(response.data);
        enqueueSnackbar("Conversation created successfully", { variant: "success" });
        await new Promise(resolve => setTimeout(resolve, 100));
        console.log("Conversation created successfully", response.data, conversations);
    } catch (error:any) {
        enqueueSnackbar("Failed to create conversation", { variant: "error" });
        throw new Error(error);
    }
};

我尝试设置超时并使用 .then/.catch 而不是 try/catch,但这些方法不同步。当我第一次按下提交按钮时,该方法在“未找到活动对话”处停止。然而,第二次按下它会按预期工作。是什么原因导致这个问题?

javascript reactjs typescript react-hooks react-tsx
1个回答
0
投票

评论中指出,我应该直接使用

response.data
中的
getUserConversations
,而不是使用状态。当然!!非常感谢尤瓦拉吉!!

© www.soinside.com 2019 - 2024. All rights reserved.