json 如何在React中使用JavaScript处理获取

tzdcorbm  于 2023-11-20  发布在  React
关注(0)|答案(1)|浏览(105)

我是react的新手,我试图访问一个API的数据,我做了两个fetch来获取数组值,当你点击一个表的一行时,我做了一个处理程序来打印console.log。当我点击表时,它会显示客户的id(这个id是我用get customer fetch获取的id),但是当我试图用getHistory fetch获取另一个值时,它会打印我undefined。
以下是提取:

getCustomers(){

        fetch(

            DOMAIN+'/api/customers/shop/'+this.props.salon, {
                method: 'get',
                dataType: 'json',
                headers: {
                    'Accept': 'application/json',
                    'Content-Type': 'application/json',
                    'Authorization':'Bearer '+this.props.token
                }
            })
            .then((response) =>
            {

                return response.json();
            })
            .then((responseData) => {
                responseData.map(function (v) {
                    v.platform = v.app ? v.app.platform : null  })
                this.setState({customers:responseData});
               //console.log(responseData);

            })
            .catch(function() {
                console.log("error");
            });
    }

 getHistory() {
        fetch(
            DOMAIN+'/api/orders/',{
                method: 'get',
                dataType: 'json',
                headers: {
                    'Accept': 'application/json',
                    'Content-Type': 'application/json',
                    'Authorization':'Bearer '+this.props.token
                }
            })
            .then((response) =>
            {

                return response.json();
            })
            .then((responseData) => {
                responseData.map(function (v) {
                    v.platform = v.app ? v.app.platform : null  })
                this.setState({orders:responseData});
                console.log(responseData);

            })
            .catch(function() {
                console.log("error");
            });

    }

字符串
下面是处理程序:

handleCellClick(y,x,row){
            //this.getHistory(this.state.orders);
    
            var ab= this.state.orders
            this.setState({
                open:true,
                slideIndex: 0,
                newForm:false,
                customer:{...row,_id:row._id},
                order:{...x,customer:x.customer}
    
            });
            this.getCustomers(row._id);
            this.getHistory(x.customer);
            console.log(row._id);
            console.log(x.customer);
    
        }


我得到了row._id,但客户值返回undefined,

bz4sfanl

bz4sfanl1#

您需要在getHistory方法中返回promise,然后使用then子句将调用链接到此方法。

getHistory() {
       return fetch(
            DOMAIN+'/api/orders/',{
                method: 'get',
                dataType: 'json',
                headers: {
                    'Accept': 'application/json',
                    'Content-Type': 'application/json',
                    'Authorization':'Bearer '+this.props.token
                }
            })
            .then((response) =>
            {

                return response.json();
            })
            .then((responseData) => {
                responseData.map(function (v) {
                    v.platform = v.app ? v.app.platform : null  })
                this.setState({orders:responseData});
                console.log(responseData);

            })
            .catch(function() {
                console.log("error");
            });

    }

字符串
然后像这样在单元格单击处理函数中调用它

handleCellClick(y,x,row){
        //this.getHistory(this.state.orders);

        var ab= this.state.orders
        this.setState({
            open:true,
            slideIndex: 0,
            newForm:false,
            customer:{...row,_id:row._id},
            order:{...x,customer:x.customer}

        });
        this.getCustomers(row._id);

        this.getHistory(x.customer).then(response => console.log(response))  
        console.log(row._id);
        console.log(x.customer);

    }

相关问题