我對JS比較陌生，並且正在做出反應，我正在使用Redux-Form將一個簡單的項目添加到我的mongo數據庫中。我配置了表單並且使用db連接定義了API，但是我不認爲我正確地在動作中構造了我的代碼，以便它可以用可以解釋的方式發送數據。構建Ajax調用Redux表單動作來表達Mongo
具體來說，我看到按提交後的表單數據，但得到500錯誤。有人可以指示我適當地塑造我的ajax請求的方向，以便它接收數據庫的可用數據？
新項目形式：
import React, { Component } from 'react'; import { fetchItems } from '../actions/index'; import {reduxForm} from 'redux-form'; import { createItem } from '../actions/index';
class NewItem extends Component {
render() {
const { fields: {name, category, description, image}, handleSubmit } = this.props;
return (
<form onSubmit={handleSubmit(this.props.createItem)}>
<h3>Add an Item</h3>
<div className="form-group">
<label>Item Name</label>
<input type="text" className="form-control" {...name} />
</div>
<div className="form-group">
<label>Category</label>
<input type="text" className="form-control" {...category} />
</div>
<div className="form-group">
<label>Description</label>
<textarea className="form-control" {...description} />
</div>
<div className="form-group">
<label>Image URL</label>
<input type="text" className="form-control" {...image} />
</div>
<button type="submit" className="btn btn-primary">Submit</button>
</form>
)
}
}
export default reduxForm({
form: 'NewItemForm',
fields: ['name', 'category', 'description', 'image'] }, null, {createItem})(NewItem);行動
export const FETCH_MY_ITEMS = 'FETCH_MY_ITEMS';
export const FETCH_SEARCH_ITEMS = 'FETCH_SEARCH_ITEMS';
export const CREATE_ITEM = 'CREATE_ITEM';
export const FETCH_ITEM = 'FETCH_ITEM';
export const DELETE_ITEM = 'DELETE_ITEM';
export function createItem (props) {
const request = $.post('/newItem', props).then(function (result){
return {
result
}
});
return {
type: CREATE_ITEM,
payload: request
};
}表達index.js爲的newitem
app.post("/newItem", function(req, res) {
var newItem = require('./server/api/new-item')(dbConnection);
newItem(req, res);
});
API端點
var assert = require('assert');
//add new item to
module.exports = function (dbConnection) {
return function (req, res) {
var newItem = req.body.newItem;
newItem.user = req.session.userId;
newItem.createDate = new Date;
dbConnection.collection('items').insertOne(newItem, function (err, result) {
if (err) {
res.send("error: something bad happened and your item was not saved")
}
res.send("success-item-posted");
res.end();
})
}
};
終端錯誤：類型錯誤：未定義 無法設置屬性 '用戶' 在/用戶/瑪麗/工作文件/在/Users/mary/working-files/closet-redux/index.js:184:13 位於Layer.handle [作爲handle_request]（/ /服務器/ api /新項目.js：13：22 ） Users/mary/working-files/closet-redux/node_modules/express/lib/router/layer.js：95：5）（/ Users/mary/working-files/closet-path）下的（/Users/mary/working-files/closet-redux/node_modules/express/lib/router/route.js:131:13）上的 在/etc/mysql/remove/modules/express/lib/remove/model/modules/express/lib/routent/layer.php上使用下面的命令：redis/redis/redis/redis/redis/redis/.js：95：5） at /Users/mary/working-files/closet-redux/node_modules/express/lib/router/index.js:277:22 at Function.process_params（/ Users/mary/working- files/closet-redux/node_modules/express/lib/router/index.js：330：12） at next（/Users/mary/working-files/closet-redux/node_modules/express/lib/router/index.js ：271：10） at Immediate。 （/Users/mary/working-files/closet-redux/node_modules/express-session/index.js:432:7）
在你的動作中，console.log（result）返回什麼結果？那裏可能有一個有價值的錯誤信息。另外，爲什麼不在$ .post上使用'fetch'。他們通常都是一樣的工作，但我發現fetch很適合承諾。我也想知道是否添加'.catch（error）'也會幫助捕獲錯誤。 讓我知道這是否有幫助 – bdougie
我還沒有做過任何，因爲我是一個新手，不知道他們:)我剛剛添加控制檯日誌 - 並添加終端錯誤的問題。 –
看起來像我有一個用戶的問題...我應該讓我登錄的用戶在與userId存儲的會話...我會進一步瞭解這一點。 –