React.js-我正在尝试在弹出窗口中处理事件,但在事件执行后弹出窗口未按应有的方式呈现 [英] Reactjs - I am trying to handle and event in a popup, but the popup is not being rendered as it should after an event execution
问题描述
我有一个函数,当用户单击reactjs应用程序的弹出窗口中的按钮时,就会调用该函数.
I have a function that is called when the user clicks a button on a popup of a reactjs applicatiomn.
sendAnswer = () => {
event.preventDefault();
console.log(this.answer);
const data = { answer: this.answer };
const requestInfo = {
method: 'POST',
body: JSON.stringify(data),
headers: new Headers({
'Content-Type': 'application/json'
}),
};
fetch('http://www.mocky.io/v2/5d920649310000d48110ccd7', requestInfo)
.then(response => {
if(response.ok) {
console.log('ok')
this.setState({sentAnswer: true})
return response.json()
}
throw new Error("Erro ao enviar a resposta...");
})
.catch(e => {
this.setState({ message: e.message });
});
}
我在render()中有以下代码:
I have this code here in render():
{!this.state.sent ? (
<textarea type="text" id="form10" className="md-textarea form-control" rows="3" onChange={e => this.answer = e.target.value} placeholder="Insira a sua resposta aqui" />
) : (
<Alert color="primary" className="text-center"> Message was sent! </Alert>
)}
但是,弹出窗口没有刷新. sendAswer函数正在被调用并执行,但是我需要刷新弹出窗口并显示消息消息已发送!".执行后.
However, the popup is not refreshed. The sendAswer function is being called and executed, but I need to refresh the popup and show the message "Message was sent!" after its execution.
我该怎么做?
推荐答案
this.setState({sentAnswer: true})
这是您正在更新的状态,但是您的状况基于!this.state.sent
.
This is the state you are updating but your condition is base on !this.state.sent
.
将条件更改为!this.state.sentAnswer
或this.setState({sent: true})
.我相信这就是它,只是打错了字眼.
Either change the condition to !this.state.sentAnswer
or this.setState({sent: true})
. I believe this is what it is and was just mistyped.
这篇关于React.js-我正在尝试在弹出窗口中处理事件,但在事件执行后弹出窗口未按应有的方式呈现的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!