如何将自定义表单从 jQuery formBuilder 保存到 MongoDB 数据库？

问题描述

Link to image of what the console logs when I click save button

保存按钮在控制台中生成一组对象。我如何将表单内容保存到我的 mongoDB 数据库中？请注意，我是编码新手，在过去的一周里我一直在努力解决这个问题，所以如果有人知道解决方案，在合理的范围内为新手分解它，将不胜感激！

反应组件

import React,{ Component,createRef } from 'react';
import { connect } from 'react-redux';
import $ from 'jquery';
import PropTypes from 'prop-types';

window.jQuery = $;
window.$ = $;

require('jquery-ui-sortable');
require('formBuilder');

class TestFormMaker extends Component {
    state = {
        name: '',data: []
    };

    options = {
        formData: [
            {
                type: 'header',subtype: 'h1',label: 'Test Form 1'
            }
        ],onSave: (event,formData) => {   //Auto binds `this`
        // const newForm = {
        //     name: this.state.name,//     form: formData
        // };

        // Add form via addForm action
        // this.props.addForm(newForm);
        console.log(formData);
    }
    };

    fb = createRef();
    componentDidMount() {
        $(this.fb.current).formBuilder(this.options);
    }
    render() {
        return (
                <div id="fb-editor" className="form" ref={this.fb} />
        );
    }
}

export default TestFormMaker;

index.js 文件（后端服务器）

const express = require('express');
const mongoose = require('mongoose');
const cookieSession = require('cookie-session');
const passport = require('passport');
const keys =require('./config/keys')
require('./models/User');
require('./models/Form');
require('./services/passport');

mongoose.connect(keys.mongoURI,{
    useNewUrlParser: true,useUnifiedTopology: true,});

// useNewUrlParser: true,// useUnifiedTopology: true,// ^ these code snippets get rid of those pesky deprecation warnings that mongoose devs haven't gotten rid of!


const app = express();

// sets a time limit for how long the cookie authentication will last for the user before expiring and requiring the user logs in again
app.use(
    cookieSession({
        maxAge: 30 * 24 * 60 * 60 * 1000,// days * hours * minutes * seconds * milliseconds
        keys: [keys.cookieKey],})
)

app.use(passport.initialize());
app.use(passport.session());

require('./routes/authRoutes')(app);
require('./routes/testRoutes')(app);




// To send production build to heroku
if (process.env.NODE_ENV === 'production') {
    // Express will serve up production assets
    app.use(express.static('client/build'));
    // Express will serve up the index.html file if routee isn't recognized
    const path = require('path');
    app.get('*',(req,res) => {
        res.sendFile(path.resolve(__dirname,'client','build','index.html'))
    });
}

// PORT dynamically chosen between Heroku's assignment and the local machine port.

const PORT = process.env.PORT || 5000;
app.listen(PORT);

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）