React Native错误:可能未处理的承诺拒绝-无法读取属性数据

React Native Error: Possible Unhandled Promise Rejection - Cannot read property data

本文关键字:拒绝 读取 数据 属性 承诺 错误 Native 未处理 React      更新时间:2023-09-26

我有一个奇怪的问题,我不能很精确地与我的React Native应用程序。我使用Lodash循环通过API响应设置位置数组的状态使用返回的响应清除数组后。当我在循环中只显示响应的值/键时,它工作得很好,但是当我尝试使用setState时,我得到一个可能的非手动承诺错误。

下面是循环和设置状态的代码:

    updateMarkers(payload) {
        this.setState({
            markers: []
        })
        let id = 0
        _.forOwn(payload, function(value, key) {
            this.setState({
                markers: [
                    ...this.state.markers,
                    {
                        coordinate: key.coordinates,
                        key: id++
                    }
                ]
            })
        })
        console.log(this.state.markers)
    }

下面是我收到的回复:

Possible Unhandled Promise Rejection (id: 0):
Cannot read property 'data' of undefined
TypeError: Cannot read property 'data' of undefined
    at http://localhost:8081/index.ios.bundle?platform=ios&dev=true&minify=false:113197:55
    at tryCallOne (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&minify=false:25822:8)
    at http://localhost:8081/index.ios.bundle?platform=ios&dev=true&minify=false:25908:9
    at JSTimersExecution.callbacks.(anonymous function) (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&minify=false:8801:13)
    at Object.callTimer (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&minify=false:8581:1)
    at Object.callImmediatesPass (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&minify=false:8680:19)
    at Object.callImmediates (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&minify=false:8695:25)
    at http://localhost:8081/index.ios.bundle?platform=ios&dev=true&minify=false:7405:43
    at guard (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&minify=false:7283:1)
    at MessageQueue.__callImmediates (http://localhost:8081/index.ios.bundle?platform=ios&dev=true&minify=false:7405:1)

这是当我控制台记录值和键(不设置状态)时返回的对象的样子。正确循环遍历每个对象。

Object {coordinates: Object, description: "Machine F", distance: 1.220632249131323, inventory: Array[16], pid: "-KP6ulcT9qeDb1oFFrVA"}
coordinates:Object
description:"Machine F"
distance:1.220632249131323
inventory:Array[16]
pid:"-KP6ulcT9qeDb1oFFrVA"
__proto__:Object

任何帮助都将非常感激!

您的this引用在'_。forOwn的第二个参数没有指向你的react类。Javascript函数不保留周围上下文的this。您应该使用ES6箭头函数来保持此上下文。你的呼叫this.setState({markers: []})也会引起问题。

_.forOwn(payload,(value, key) => {
            this.setState({
                markers: [
                    ...this.state.markers,
                    {
                        coordinate: key.coordinates,
                        key: id++
                    }
                ]
            })
        })

也这样。setState调用不是同步的,所以在你的_。对于自己的回调,不能保证this.state.markers是可用的。你应该重构你的代码,这样只有当setState调用在你的_。forOwn电话。

var markers =[]
        let id = 0
        _.forOwn(payload, function(value, key) {
            markers.push({
                        coordinate: key.coordinates,
                        key: id++
                    });
        });
this.setState({markers},()=>{console.log(this.state.markers)});