TypeError: JSON.stringify(...).then 不是一个函数 - React JS

Posted

技术标签:

【中文标题】TypeError: JSON.stringify(...).then 不是一个函数 - React JS【英文标题】:TypeError: JSON.stringify(...).then is not a function - React JS 【发布时间】:2020-04-17 05:49:41 【问题描述】:

我正在尝试将我的 react 应用程序与登录页面的后端连接起来。我正在使用承诺返回成功消息。

登录.js

    onSubmitSignIn = () => 
        fetch('http://localhost:5000/', 
              method : 'post',
              headers : 'Content-Type' : 'application/json',
              body : JSON.stringify(
                   userId : this.state.userId,
                   password : this.state.password
             ).then(response => response.json())
               .then(data => 
                    if(data === 'success')
                            this.props.onRouteChange('home');
                    
             )
        )
    

后端代码 -

  exports.findById = (req) => 
         return new Promise((resolve) => 
               var sql = "Select * from users where userid = '" + req.body.userId + "' ;";
               connection.query(sql,req,  function (error, results, fields) 
                    var data = JSON.parse(JSON.stringify(results)); 
                    var valid = false; 
                    if( data.length !=0 && req.body.userId === data[0].userid && req.body.password === data[0].password)
                         valid = true; 

                    if(valid) 
                         resolve(message : "success");
                    else
                         reject( message :"fail");
                    
              );
        )
  ;

点击登录按钮后,我收到一个错误“TypeError: JSON.stringify(...).then is not a function”

我尝试了一些类似问题的解决方案,但在我的情况下不起作用。

【问题讨论】:

你确定变量results中有JSON格式的数据吗?还有额外的事情,我认为你通过 javascript 传递 sql 查询是不明智的 【参考方案1】:

你错过了一个括号。 JSON.stringify() 之后应该有一个右括号。

onSubmitSignIn = () => 
  fetch('http://localhost:5000/', 
    method: 'post',
    headers:  'Content-Type': 'application/json' ,
    body: JSON.stringify(
      userId: this.state.userId,
      password: this.state.password
    )
  ).then(response => response.json())
    .then((data) => 
      if (data === 'success') 
        this.props.onRouteChange('home');
      
    );
;

【讨论】:

【参考方案2】:

then 应该在fetch 之外

fetch('http://localhost:5000/', 
    method : 'post',
    headers : 'Content-Type' : 'application/json',
    body : JSON.stringify(
         userId : this.state.userId,
         password : this.state.password
   )
).then(response => response.json())
  .then(data => 
    if(data === 'success')
            this.props.onRouteChange('home');
    
)

【讨论】:

【参考方案3】:

你有一个错字,.then 应该是 fetch 而不是 JSON.stringify

onSubmitSignIn = () => 
  fetch("http://localhost:5000/", 
    method: "post",
    headers:  "Content-Type": "application/json" ,
    body: JSON.stringify(
      userId: this.state.userId,
      password: this.state.password
    )
  )
//-^
    .then(response => response.json())
    .then(data => 
      if (data === "success") 
        this.props.onRouteChange("home");
      
    );
;

【讨论】:

以上是关于TypeError: JSON.stringify(...).then 不是一个函数 - React JS的主要内容,如果未能解决你的问题,请参考以下文章

项目中遇到Uncaught TypeError: Converting circular structure to JSON报错问题

未捕获(承诺中)TypeError:将循环结构转换为 JSON

如何对事件对象进行字符串化?

TypeError:Object在IE 11中不支持此操作

json.stringify()的妙用,json.stringify()与json.parse()的区别

TypeError: object is not iterable (cannot read property Symbol(Symbol.iterator)) JavaScript