从 POST 请求返回空 object（带节点和 Express 的秘银）

Question

Currently having an issue where a object with null values for all content except ID is returned when trying to complete a POST request from my front end. I'm also not receiving any error messages in the console. I've tested my server using Insomnia and everything works as expected with my POST. I've also tried taking the body of newEntry out of curly brackets and including headers (even though Mithril's documentation doesn't show using them).

FrontEnd

const setData = formDOM => {

  const formData = new FormData(formDOM);
  console.log("formData", formData)
  const newEntry = {};

  Array.from(formData.entries()).map(entryValue => {
    const key = entryValue[0];
    const value = entryValue[1];

    switch (value) {
      case "false":
        newEntry[key] = false;
        break;
      case "true":
        newEntry[key] = true;
        break;
      default:
        newEntry[key] = value;
        break;
    }
  });

  console.log("new entry", newEntry)

  m.request({
    method: 'POST',
    url: 'http://localhost:5000/santaslist',
    body: {
      newEntry
    }
  }).then((person) => {
    console.log("updated entry", person)
  });
}


const EntryForm = {


  // state
  data: {
    name: "",
    street: "",
    state: "",
    city: "",
    zipcode: "",
    nice: false,
    naughty: false,
    clicked: false,
  },

  // const { name, street, state, city, zipcode, nice, naughty } = data,

  view: (vnode) => (

    <form name="entry-form" id="entry-form">

       ...

      <button
        class="ui-button"
        type="button"
        data-toggle="modal"
        data-target="#exampleModal"
        onclick={() =>
        { setData(vnode.dom)}
        }
      > Add </button>

     ...

    </form >
  ),
};

export default EntryForm;

BackEnd

const app = express()
const cors = require("cors")
const pool = require("./db")
const bodyParser = require("body-parser")

// middleware
app.use(cors())
app.use(express.json())//req.body
app.use(bodyParser.json())
app.use(bodyParser.urlencoded({
    extended: true
  }))
//ROUTES//

//create a list item (POST)
app.post("/santaslist", async(req,res) => {
    console.log(req.body)
    // console.log(req.headers)
    // console.log(res)
    try {
        const { name, street, city, state, zipcode, naughty, nice } = req.body


        const newListItem = await pool.query("INSERT INTO listitems(name, street, city, state, zipcode, naughty, nice) VALUES ($1, $2, $3, $4, $5, $6, $7) RETURNING *",[name, street, city, state, zipcode, naughty, nice])

        res.json(newListItem.rows)
    } catch (err){

        console.error(err.message)
    }
})

"new entry" and "updated entry" console.logs

Answer 1

Your code is a bit overcomplicated and you're using the wrong method IMO. map is for creating a new array with the elements of an existing array transformed. What you want is forEach .

Try this instead.

let newEntry = {};

(formData.entries()).forEach(entry => {
  const [key, value] = entry;

  newEntry[key] = value === "true" ? true : false;
})

Update

As you specified in your response that the formData.entries() is an object and not an array, it should be noted that you cannot map over an object. However, you can do a for loop:

const entries = formData.entries();
let newEntry = {};

for (const key in entries)
  newEntry[key] = entries[key] === "true" ? true : false;
})

Answer 2

I was able to figure out, instead of body I used the data option.

m.request({
    method: 'POST',
    url: 'http://localhost:5000/santaslist',
    // body: newEntry,
    data: newEntry
  }).then((person) => {

    // addPersonToList(person)
    console.log("updated entry", person)

  });
}