最新消息: 电脑我帮您提供丰富的电脑知识,编程学习,软件下载,win7系统下载。

如何从节点接收JSON对象并在客户端以响应方式显示它?

IT培训 admin 6浏览 0评论

如何从节点接收JSON对象并在客户端以响应方式显示它?

我正在使用res.json发送一个json对象。在客户端,我试图将json对象设置为一个状态。

我已经尝试将.json()响应,但是仍然不能让我分配它。

这是服务器端发送JSON文件

app.get('/api/getPlace', async (req, res) => {
        const response = await client.search({
            searchType: "Coffee",
            location: "San Francisco, CA",
        })

        const foodPlace = response.jsonBody.businesses[9];

        console.log(foodPlace);
        res.json(foodPlace)
    })

下面是呈现json对象的整个组件文件

import React, { Component } from 'react';
import axios from 'axios';

class RandomPlace extends Component {
    constructor(props) {
        super(props);
        this.state = {
            response: {},
        };
    }

    async componentDidMount() {
        const res = axios.get('/api/getPlace');
        this.setState({ response: res.data })

    }

    render() {
        return (
            <div>
                {this.state.response}
            </div>
        );
    }
}

export default RandomPlace;
回答如下:

必须等待客户呼叫:

async componentDidMount() {
    const res = await axios.get('/api/getPlace');
    this.setState({ response: res.data })

}

如何从节点接收JSON对象并在客户端以响应方式显示它?

我正在使用res.json发送一个json对象。在客户端,我试图将json对象设置为一个状态。

我已经尝试将.json()响应,但是仍然不能让我分配它。

这是服务器端发送JSON文件

app.get('/api/getPlace', async (req, res) => {
        const response = await client.search({
            searchType: "Coffee",
            location: "San Francisco, CA",
        })

        const foodPlace = response.jsonBody.businesses[9];

        console.log(foodPlace);
        res.json(foodPlace)
    })

下面是呈现json对象的整个组件文件

import React, { Component } from 'react';
import axios from 'axios';

class RandomPlace extends Component {
    constructor(props) {
        super(props);
        this.state = {
            response: {},
        };
    }

    async componentDidMount() {
        const res = axios.get('/api/getPlace');
        this.setState({ response: res.data })

    }

    render() {
        return (
            <div>
                {this.state.response}
            </div>
        );
    }
}

export default RandomPlace;
回答如下:

必须等待客户呼叫:

async componentDidMount() {
    const res = await axios.get('/api/getPlace');
    this.setState({ response: res.data })

}
发布评论

评论列表 (0)

  1. 暂无评论