没有表单的React POST请求?

时间:2016-09-02 17:08:00

标签: javascript reactjs

我正在尝试熟悉发送POST数据,这次使用React。在这种情况下,我试图在没有表格的情况下这样做。

我的前端React代码具体如下:

stockconfirmbuy: function(){
var stin = this.refs.stockpriceref.innerHTML;
  var totalbuyval = stin * this.state.stockdnum;    
    return (<div>
    <p>Are you sure you would like to buy {this.refs.stocknameref.innerHTML} stock at ${this.refs.stockpriceref.innerHTML} per share?</p>
    <p>Select Amount:</p>
    <input className="form-control" defaultValue="1" type="number" value={this.state.stockdum} onChange={this.changestocknum} /> 
    <p>Your Total:</p>
    <p>${totalbuyval}</p>        
    <div id="buttongroups">
    <button className="btn btn-success" onClick={this.buyprocess}>Buy It</button>
    <button className="btn btn-danger" onClick={this.cancelprocess}>Cancel</button>
    </div>
</div>);
},    

为了清楚起见,我的初始stockdnum州值为1。

同时,我的架构安排如下:

var UserSchema = new Schema({

  email: { type: String, unique: true, lowercase: true},
  password: String,
    icapital: {type: Number, default: 9001},
  profile: {
    name: { type: String, default: ''},
    picture: { type: String, default: ''}
  },
  address: String,
  history: [{
    date: Date,
    stocklabel: String,
    stockname: String,
    stocknumber: Number,
    stockpaid: Number
  }]
});

我尝试将交易编码到我的routes/user.js页面中是这样的:

router.post('/profile', function(req, res, next) {
  User.findOne({ _id: req.user._id }, function(err, user) {
    if (err) return next(err);
    if (req.body.stocklabel) user.history.stocklabel = req.body.stocklabel;
    if (req.body.stockname) user.history.stockname = req.body.stockname;
    user.history.date = Date();
    if (req.body.stocknumber) user.history.stocknumber = req.body.stocknumber;
    if (req.body.stockprice) user.history.stockprice = req.body.stockprice;
    user.save(function(err) {
      if (err) return next(err);
      req.flash('success', 'Purchase sucessful');
      return res.redirect('/profile');
    });
  });
});

首先,我想确保我的交易符合我的架构安排。

其次,回到我的前端React代码,我不知道如何将我的React中的相关数据带入我的数据库。我希望操作在{this.buyprocess}上运行。但是,由于它不是传统的输入形式,我不确定如何将其转换为提交按钮,以传输以下信息。

{this.refs.stockpriceref.innerHTML}代表股票标签。

{this.state.stockdnum}表示金额或库存号。

{totalbuyval}代表总费用或股票价格。

我不确定this.buyprocess函数中的代码是什么样的。

0 个答案:

没有答案