uni.request 中的 abort 使用技巧 在.vue 文件中使用报错 Cannot read property 'promise' of undefined

在 vue 文件中如 把每一次请求对象存在 data 中 就会引发此BUG,特别是vue3 的uni-app 项目 因为 vue3 的响应是用了 ES6的 Proxy，此时 我们想取出对应的重复请求，拿到对应的请求为 Proxy 当要阻断请求时调用abort() 方法就会报错，解决报错也非常简单，把请求返回 不存在data中就能够解决此问题，此问题在编译成微信小程序必然会出现

常见不会出现此问题 （一般都会封装请求，从而绕开了此问题）

<template>  
    <view class="content">  
        <button @click="sendhttp('http://192.168.88.65:3339/integralRecord/DelIntegralRecord',{type:2})">  
            发送HTTP</button>  
        <button @click="sendhttp('http://192.168.88.65:3339/integralRecord/DelIntegralRecord',{type:1})">  
            发送HTTP</button>  
        <button @click="sendhttp('http://192.168.88.65:3339/integralRecord/DelIntegralRecord1',{type:1})">  
            发送HTTP2</button>  
    </view>  
</template>  

<script>  
    export default {  
        data() {  
            return {  
                httpurl: []  
            }  
        },  
        methods: {  
            sendhttp(url, data = {}) {  

                const is = this.httpurl.find(u => u.url === url && u.data === JSON.stringify(data))  
                const indexId = this.httpurl.findIndex(u => u.url === url && u.data === JSON.stringify(data))  

                if (is) {  

                    //#ifdef H5  
                    is.requestTask.abort();  
                    //#endif  

                    //#ifdef MP-WEIXIN  
                    is.requestTask  
                    //#endif  
                }  

                const requestTask = uni.request({  
                    url,  
                    data,  
                    complete() {  
                        console.log('响应了');  
                    }  
                })  

                this.httpurl.push({  
                    url,  
                    data: JSON.stringify(data),  
                    requestTask  
                })  
            }  
        }  
    }  
</script>

修改后

<template>  
    <view class="content">  
        <button @click="sendhttp('http://192.168.88.65:3339/integralRecord/DelIntegralRecord',{type:2})">  
            发送HTTP</button>  
        <button @click="sendhttp('http://192.168.88.65:3339/integralRecord/DelIntegralRecord',{type:1})">  
            发送HTTP</button>  
        <button @click="sendhttp('http://192.168.88.65:3339/integralRecord/DelIntegralRecord1',{type:1})">  
            发送HTTP2</button>  
    </view>  
</template>  

<script>  
    const httpurl = {}  
    export default {  
        data() {  
            return {  
                title: 'Hello',  
            }  
        },  

        methods: {  
            sendhttp(url, data = {}) {  

                for (let s in httpurl) {  
                    // console.log(this.httpurl[s].url);  
                    if (httpurl[s].url === url) {  
                        httpurl[s].requestTask.abort()  
                        delete httpurl[s]  
                    }  
                }  
                const requestTask = uni.request({  
                    url,  
                    data,  
                    complete() {  
                        console.log('响应了');  
                    }  
                })  

                const uniqueId = requestTask.uniqueId || new Date().getTime()  
                httpurl[uniqueId] = {  
                    requestTask,  
                    url,  
                    data: JSON.stringify(data)  
                }  
            }  
        }  
    }  
</script>