„Bei erfolgreichem Axios-Aufruf wurde keine entsprechende Meldung angezeigt'-Fragen und Antworten zum chinesischen PHP-Netzwerk
„Bei erfolgreichem Axios-Aufruf wurde keine entsprechende Meldung angezeigt'
P粉399090746
P粉399090746 2023-09-13 09:06:49
0
1
496

Ich weiß nicht, wie ich die Antwort auf einen erfolgreichen Axios-Anruf erhalten und die Erfolgsmeldung anzeigen kann.

Es gibt eine Schaltfläche namens „Workflow-Reihenfolge ändern“ und diese verfügt über eine OnClick-Funktion.

Dies ist die onClick-Funktion. Die Funktion „changeWorkflowOrder“ führt einen Axios-Aufruf aus.

function changeWorkflowOrder() { const response = axios.post(js_site_url + '/sort-detail', $('#sortable').sortable("toArray"), { headers: { 'Content-Type': 'multipart/form-data' } }) }

Ich möchte die erfolgreiche Antwort des Axios-Aufrufs erfassen und, wenn die Antwort des Axios-Aufrufs erfolgreich ist, die Erfolgsmeldung im HTML-Span-Tag anzeigen. Die Meldung darf nur 4 Sekunden lang angezeigt werden. Nach 4 Sekunden muss die Erfolgsmeldung ausgeblendet werden.

Ich habe versucht, das zu erstellen. Dies ist die Funktion „changeWorkflowOrder“, die ich ausprobiert habe.

function changeWorkflowOrder() { const response = axios.post(js_site_url + '/sort-detail', $('#sortable').sortable("toArray"), { headers: { 'Content-Type': 'multipart/form-data' } }); response.then((result) => { $("#alert_msg").html(result.data.success ? "Success" : "Order change successfully"); clearTimeout(timeoutId); timeoutId = setTimeout(function() { $("#alert_msg").hide(); }, 4000); }); }

Dieser Code zeigt die Fehlermeldung korrekt an. Aber nach 4 Sekunden wird die Fehlermeldung angezeigt, die Meldung „Bestelländerung erfolgreich“ wird nicht ausgeblendet, ich denke, der Axios-Anrufantworterfassungsteil ist falsch.

Wie kann ich die Antwort eines Axios-Aufrufs erfassen und 4 Sekunden lang eine Erfolgsmeldung in einem HTML-Span-Tag anzeigen?

P粉399090746
P粉399090746

Antworte allen (1)
P粉884667022

我建议首先创建一个axios客户端用于你的api/webservice:

import axios from 'axios'; export const myApiClient = axios.create({ baseURL: '...' /* 在你的情况下,这将是js_site_url */, headers: { 'Content-Type': 'multipart/form-data' /* 这当然可以在任何特定实例调用此客户端时被覆盖 */ } });

然后重写你的onclick函数,并实现延迟,参考这个Stack Overflow回答

import {myApiClient} from '...'; /* 如果你决定将其存储在单独的文件中,请导入你的客户端 */ const delay = ms => new Promise(res => setTimeout(res, ms)); async function changeWorkflowOrder() { const myPostData = $('#sortable').sortable("toArray"); return await myApiClient.post('/sort-workflow-detail-manage', myPostData) .then(await res => { const alertMsg = res.data?.success ? '成功' : '成功更改顺序'; $("#alert_msg").html(alertMsg); await delay(4000).then(_ => $("#alert_msg").hide()); }) .catch(err => /* 在这里处理失败的api请求 */); }
    Neueste Downloads
    Mehr>
    Web-Effekte
    Quellcode der Website
    Website-Materialien
    Frontend-Vorlage
    Über uns Haftungsausschluss Sitemap
    Chinesische PHP-Website:Online-PHP-Schulung für das Gemeinwohl,Helfen Sie PHP-Lernenden, sich schnell weiterzuentwickeln!