後AJAXネット::: ERR_EMPTY_RESPONSEに反応します その後、は、私は3つのAjaxの機能を持っている5つの要求
onFetchTodosFromDatabaseをonFetchTodosFromDatabase呼び出す - データベースからデータを取得し、
このデータに 状態を変更onRemoveFromList(id) {
return axios.post('/todo/removeFromList/' + id)
.then(this.onFetchTodosFromDatabase())
.catch(function (error) {
throw error;
});
}
onAddToList(id) {
return axios.put('/todo/addtoList/' + id)
.then(this.onFetchTodosFromDatabase())
.catch(function (error) {
throw error;
});
}
onFetchTodosFromDatabase() {
return axios.get('/todo')
.then(res => {
let data = res.data;
this.setState({ todos: data });
})
.catch(function (error) {
throw error;
});
}
ルータ:
router.get('/', function(req, res, next) {
Todo.find(function(err, doc) {
if(err) throw err;
res.json(doc);
});
});
// find todo by id and change display property to true
router.put('/addToList/:id', function(req, res, next) {
var id = req.params.id;
Todo.findByIdAndUpdate(id, { $set: { display: true }}, {new: false},
function(err, doc) {
if(err) {
throw err;
}
doc.save();
});
});
router.post('/removeFromList/:id', function(req, res, next) {
var id = req.params.id;
Todo.findByIdAndUpdate(id, { $set: { display: false }}, {new: true},
function(err, doc) {
if(err) {
throw err;
}
doc.save();
});
});
レンダリング:
enter code here
render() {
const todos = this.props.todos.map((todo, i) => {
let property = {
title: todo.title,
duration: todo.duration,
startTimeHours: todo.startTimeHours,
startTimeMinutes: todo.startTimeMinutes,
finishTimeHours: todo.finishTimeHours,
finishTimeMinutes: todo.finishTimeMinutes,
id: todo._id,
}
if(todo.display) {
return (
<Todo removeFromList={this.props.removeFromList} key={ i} property={property}/>
);
}
});
return(
<div className="row">
<ul>
{todos}
</ul>
</div>
)
問題:
私は2つの主要コンポーネントがあります:ドスと(一つの表示タスク(すべてのドス)、および他のディスプレイ藤堂リストdisplay == true)、ボタンをクリックするとaddToList関数が呼び出され、表示がtrueになり、TodoList Componentに表示され、ボタンfiをクリックするまでレンダリングされますFTH時間(異なるボタン)
多分2分後、私は、デバッグ後にこの
PUT http://localhost/todo/addtoList/591afa29891b6f1c8fa58124ネット:: ERR_EMPTY_RESPONSE
のように私はすべてのAjaxがで動作しますが、SETSTATEを呼び出すことを認識し、エラーが発生しますPOST要求ajax (addToListとremoveFromList)を5回呼び出した後、fetchFromDatabaseは起動されません。
質問:
- 私はこのエラーを防ぐにはどうすればよいですか?
- なぜ5つのリクエストを行う前に問題なく動作しますか?