0
module.exports = {
    name: 'segmentfault',
    methods: {
        loadData: function(uuid) {
            this.$http.get('/mockjs/test', // url
                           {a: 1},  // params
                           {timeout:500}  // options
                           ).then(
                           // success callback
                           function(response) {
                               console.log("成功这里没问题")
                           },
                           // fail callback
                           function(response) {
                               console.log(response.status); //为0
                               console.log(response.statusText); //为空
                               console.log("黑人问号?");
                           }

需求:
我想实现超时后写一个回调

我的思路
如果能够知道statusText是timeout,然后我就修改data的某一个值x,然后再用watch监听x,然后来写timeout的回调。

我遇到的问题
statusText并没有显示timeout。。呵呵。。

请问大家有没有解决方法?或者其他方法?谢谢

2016-06-25 提问
2 个回答
1

已采纳

VueResource 其實還是有一些 bug ,有空再寫個 PR ...

研究了下源碼,可以透過一些方式實現你要的結果,首先是設置 timeout ,會觸發 timeout interceptor

這是原本的 timeout interceptor

export default function (request, next) {

    var timeout;
       
    // 有設置值就啟動一個定時器
    if (request.timeout) {
        timeout = setTimeout(() => {
            // 這裡有問題,作者寫了一個 request.abort() , 這裡卻用 cancel() 囧
            // 所以在 timeout 觸發時就會出問題
            // 就算是 abort ,也只會 request 被取消掉,不會有任何返回
            // 就像你看到的 status statusText 都是空的
            request.cancel();
        }, request.timeout);
    }

    next((response) => {

        clearTimeout(timeout);

    });
}

在不修改源碼的前提下,我們要繞過原本的 timeout interceptor ,自己實現一個 timeout interceptor 的流程 ,所幸是作者提供了增加自定義 interceptor 的方法,下面是我的實現方式,有兩種,可以改成其他符合你需求的

timeout 照樣回傳 resposne

jsFiddle

timeout 中斷 Request ,不會有任何 response ,但會觸發設置的 onTimeout 事件

jsFiddle

0

方法1并不会timeout触发并不会停止请求

撰写答案

你可能感兴趣的

推广链接