将 json 对象从反应前端传递到 rails api 时出错

Question

我正在尝试将我的表单数据从我的 React 前端发送到 rails api，但是 this happens

这是我处理表单数据的反应代码

constructor(props) {
  super(props);
  this.user= {};
  this.state = this.getInitialState();
}

getInitialState = () => {
     const initialState = {
       email: "",
       password: ""
     };
     return initialState;
 }

change = e => {
  this.setState({
    [e.target.name]: e.target.value
  });
};

onSubmit = (e) => {
  e.preventDefault();
  this.user = JSON.stringify(this.state)
  this.user = "{\"user\":" + this.user + "}"
  console.log(this.user);
  fetch('http://localhost:3001/v1/users', {
    method: 'POST',
    body: this.user
  }).then(function(response) {
    console.log(response.json());
  })

  this.setState(this.getInitialState());
}

此代码在控制台中给出以下字符串：

{"user":{"email":"test@user.com","password":"password123."}}

Rails:

class V1::UsersController < ApplicationController

def create

@user = User.new(user_params)

if @user.save
  render :create
else
  head(:unprocessable_entity)
 end
end
private

 def user_params
  params.require(:user).permit(:email, :password, :password_confirmation)
 end
end

对 PAW 做同样的事情会得到积极的结果

PAW

请帮忙。我已经尝试修复此问题 2 天了。

提前致谢。

Answer 1

问题就在这里

this.user = "{\"user\":" + this.user + "}"

它看起来像 json，但它实际上是一个 string.You 可以使用 typeof 来检查它。

console.log(typeof this.user) //string

有很多选项可以解决这个问题problem.Here是一个例子。

const users = {
  user: user
}
console.log(users)
const user_json = JSON.parse(JSON.stringify(users))
console.log(typeof user_json)

将 json 对象从反应前端传递到 rails api 时出错

Error when passing json object from react frontend to rails api

json

reactjs

paw