NextJS和React:无法读取未定义的属性'email'

时间:2018-09-28 14:30:23

标签: node.js reactjs next.js

我尝试将数据从客户端发送到服务器。为此,我将React与NextJS一起使用,因为您在一个应用程序中拥有服务器和客户端。

我使用以下handleSubmit函数:

handleSubmit() {
  const email = this.state.email;
  fetch('/', {
    method: 'POST',
    body: email,
  });
}

这是我项目中server.js中的/文件

const express = require('express')
const next = require('next')
const bodyParser = require('body-parser')

const dev = process.env.NODE_ENV !== 'production'
const app = next({ dev })
const handle = app.getRequestHandler()

app.prepare()
.then(() => {
  const server = express()

  //parse application
  server.use(bodyParser.urlencoded({ extended: false}))

  //parse application/json
  server.use(bodyParser.json())

  server.post('/', (req, res) => {
    console.log(req.body.email);
    res.end("success!");
  })

  server.get('*', (req, res) => {
    return handle(req, res)
  })

  server.listen(3000, (err) => {
    if (err) throw err
    console.log('> Ready on http://localhost:3000')
  })
})
.catch((ex) => {
  console.error(ex.stack)
  process.exit(1)
})

运行handleSubmit函数时,我从服务器控制台获得以下输出:

Cannot read property 'email' of undefined

我的错误到底在哪里? 我在节点JS环境中经验不足。如果您能给我具体解决方案,我将不胜感激。谢谢您的答复。

1 个答案:

答案 0 :(得分:2)

似乎您必须解析标头和JSON。对电子邮件进行字符串化。

fetch('/', {
      method: 'POST',
      headers: {
        'Accept': 'application/json',
        'Content-Type': 'application/json'
      },
      body: JSON.stringify({email:email}),
    }).then((res)=> console.log('Worked'))