Monday, 25 November 2019

Cannot read property 'setState' of undefined - Converted to arrow function

I'm trying to set state within a function. Usually I would just convert this into an arrow function or bind this to solve the issue however if I convert this particular function to an arrow function I'm not getting the result needed (which is an image map response to be used as a layer in openlayers 6). I suspect it's because of this.response part of the code that's inside the callback function.

Here's the code.

this.makeRequest(newSrc, function() {
                const arrayBufferView = new Uint8Array(this.response)
                const blob = new Blob([arrayBufferView], { type: 'image/png' })
                const urlCreator = window.URL || (window).webkitURL
                const imageUrl = urlCreator.createObjectURL(blob)
                tile.getImage().src = imageUrl
                this.setState({
                    isLoading: false
                })
            })

I've tried converting it to an arrow function which stops the setState is not a function issue, but doesn't return the map on the fe. For context the makeRequest function is a new XMLHttpRequest

makeRequest = (url, onLoad) => {
        this.setState({
            isLoading: true
        })
        const client = new XMLHttpRequest()
        client.open('GET', url)
        client.responseType = 'arraybuffer'
        client.setRequestHeader('Authorization', getCredential())
        client.onload = onLoad
        client.send()
    }


from Cannot read property 'setState' of undefined - Converted to arrow function

No comments:

Post a Comment