麻烦构建具有ajax调用的反应组件

时间:2016-03-18 05:12:04

标签: javascript ajax node.js mongodb reactjs

我正在尝试使用评论框示例中的node.js教程构建一个简单的reactjs应用。 我无法将注释保存到数据库,这是mongodb。

这是代码,

comment_box.jsx

var CommentBox = React.createClass({

   loadCommentsFromServer: function() {
    var commBox = this;
    $.ajax({
      url: commBox.props.url,
      dataType: 'json',
      cache: false
    }).done(function(data) {
        commBox.setState({data: data});
    });
  },
  handleCommentSubmit: function(comment) {
    var commBox = this;
    var comments = this.state.data;
// Optimistically set an id on the new comment. It will be replaced by an
// id generated by the server. In a production application you would likely
// not use Date.now() for this and would have a more robust system in place.
    comment.id = Date.now();

    var newComments = comments.concat([comment]);
    this.setState({data: newComments});
    $.ajax({
      url: commBox.props.url,
      dataType: 'json',
      type: 'POST',
      data: comment    
      }).done(function(data) {
        commBox.setState({data: data});
    });
  },

api.js

//api for listing and posting comments

//bring comments model
var Comment = require('../models/comment.js');


exports.post = function(req, res, err) {
    new Comment({comment: req.comment, author: req.author}).save(function() {
      if(!err) {
        console.log('saved');
      }
      else {
        console.log('save failed');
      }

    });
}

exports.list = function(req, res) {
  Comment.find(function(err, comments) {
    res.send(comments);
  });
}

router.js

var express = require('express');
var Router = express.Router();
var path = require('path');
var api = require('../controllers/api.js');

Router.get('/', api.list);

Router.post('/', api.post);

module.exports = Router;

server.js

// set up the RESTful API, handler methods are defined in api.js
app.use('/api/v1/*', require('./server/routes/router.js'));

错误出现在api.js中的exports.post中由于某种原因,req并没有附带正文,我尝试使用节点检查器进行调试,但无法查看问题所在。任何帮助将非常感激。如果您需要我发布任何进一步的细节以了解问题,请告诉我。基本上,在控制台中我得到错误ERR_RESPONSE_EMPTY。

有关错误的更多详细信息, 我正在我的苹果机器上运行节点服务器os x el capitan,使用expressjs完成路由,在我加载页面后,安装包含注释表单的组件,您可以在其中添加注释并发布它们。所以,这里当我按下post按钮时,ajax调用应该将注释发布到数据库并且react组件将会更新。但是,电话会议没有发生。在我的comment_box.jsx代码中,您可以看到后期通话。我在server.js中发布的这一位将处理这些路由。我有一个router.js文件和api.js,其中包含发布和列出注释的方法。

我期待提交评论时,表单提交将触发react函数来执行ajax调用并更新数据库。但是,它没有发生我得到了ERR_RESPONSE_EMPTY。

0 个答案:

没有答案