reactjs 在React JS中解码json响应

q3aa0525 于 2023-06-05 发布在 React

关注(0)|答案(1)|浏览(206)

我正在尝试解码从我的flask后端收到的jsonized响应，如下所示：

if success_flag:
            waterdetails = res["Transaction_chain"]
            print(waterdetails)
            senderObject.mine_block(waterdetails)
            #print(senderObject.chain)
            recieveObject.mine_block(waterdetails)
            #print(recieveObject.chain)
            print("Here as well")
            if senderObject.is_chain_valid() and recieveObject.is_chain_valid():
                adminDataBase.requestUpdate("_id",ObjectId(senderID),
                {"Transaction_So_Far":senderObject.chain})
                adminDataBase.requestUpdate("_id",ObjectId(recieverID),
                {"Transaction_So_Far":recieveObject.chain})
                print("Success!!!!!")
                return(jsonify({"Yes":"Transaction Successful!"}))

下面是我的React JS onClick函数来选择响应：

onClick={async(e)=>{
        e.preventDefault();
        let pwd = prompt('Please enter your Password to confirm!');
        const JSONString = {
            email:props.Email,
            _id:details._id,
            Credits:details.Credits,
            password:pwd
        }
        const response = await fetch('http://localhost:5000/make-a-transaction',{
          method: 'POST',
          headers:{
            'Content-Type':'application/json'
          },
          body:JSON.stringify(JSONString)
        });
        console.log("Hello "+response.json());
      }}

下面是我后端控制台：

下面是我的console.log输出：

有人可以帮助我以正确的方式解码json，以便我得到我的响应消息和正文？

reactjs

来源：https://stackoverflow.com/questions/63252481/decoding-json-response-in-react-js

1条答案

按热度按时间

t98cgbkg1#

response.json()实际上返回一个Promise，如果body可以解析为json，则解析为javascript对象，否则拒绝。（您也可以在记录的消息中看到这一点。）
要解决这个问题并获取对象，你可以像使用fetch返回的Promise一样使用await：

const response = await fetch('http://localhost:5000/make-a-transaction',{
   method: 'POST',
   headers:{
     'Content-Type':'application/json'
    },
    body:JSON.stringify(JSONString)
});
const content = await response.json();
console.log("Hello ", content);

请注意，您应该始终添加错误处理（在这种情况下通常是try .. catch块）中的异步函数。如果在你的async函数中的某个地方发生了错误，它只会返回一个Promise，这个Promise会拒绝这个错误。但是，您的onClick函数可能被某些不会计算返回值的东西调用。因此，错误将被默默地忽略，这在大多数情况下不是您想要的。

赞(0）回复(0）举报 2023-06-05

我来回答

reactjs 在React JS中解码json响应

1条答案

相关问题

热门标签

最新问答