代码之家 › 专栏 › 技术社区 › Davide Lorino

将状态对象中的字符串数组从React发布到MongoDB

mongoose-schema mongoose mongodb reactjs node.js

Davide Lorino · 技术社区 · 5 年前

我有这样一个mongoose用户模式:

const userSchema = new mongoose.Schema({
  name: {
    type: String,
    trim: true,
    required: true,
    maxlength: 32
  },
  email: {
    type: String,
    trim: true,
    required: true,
    unique: 32
  },
  hashed_password: {
    type: String,
    required: true
  },
skills: {
     type: Array,
     default: [],
     required: true
   }
}, {timestamps: true});

这个 skills 字段是数组。理想情况下,我希望在用户输入时动态呈现文本输入,以便用户可以输入任意数量的技能。

将这些技巧输入到每个单独的文本输入中后,我想将它们连接到一个数组中,通过POST请求发送到db。

我该怎么做?

以下是我的代码,没有数组输入:

Post请求

const signup = (user) => {
    fetch(`${API}/signup`, {
      method: "POST",
      headers: {
        Accept: 'application/json',
        "Content-Type": "application/json"
      },
      body: JSON.stringify(user)
    })
    .then(response => {
      return response.json();
    })
    .catch(err => {
      console.log(err);
    });
  };

const clickSubmit = event => {
    event.preventDefault();
    signup({name, email, password, studying});
  };

不使用动态 技能 输入

const signUpForm = () => (
    <form>
        <div className="form-group">
            <label className="text-muted">Name</label>
            <input onChange={handleChange('name')} type="text" className ="form-control" />
        </div>

        <div className="form-group">
            <label className="text-muted">Email</label>
            <input onChange={handleChange('email')} type="email" className ="form-control" />
        </div>

        <div className="form-group">
            <label className="text-muted">Password</label>
            <input onChange={handleChange('password')} type="password" className="form-control" />
        </div>

        <div className="form-group">
            <label className="text-muted">Studying</label>
            <input onChange={handleChange('studying')} type="text" className ="form-control" />
        </div>

        <button onClick={clickSubmit} className="btn btn-primary">
          Sign Up
        </button>
    </form>
  );

0 回复 | 直到 5 年前

Pushprajsinh Chudasama 5 年前

您可以通过以下方式更改模型

const userSchema = new mongoose.Schema({
  name: {
    type: String,
    trim: true,
    required: true,
    maxlength: 32
  },
  email: {
    type: String,
    trim: true,
    required: true,
    unique: 32
  },
  hashed_password: {
    type: String,
    required: true
  },
skills: {[
    //add the field you want , For example :- `in : {type: String , default: null}`
    required: true
   ]}
}, {timestamps: true});

这将帮助你解决你的问题。