Vue.js 使用vue和webpack获取对同一url的重复请求

我在web控制台中显示了奇怪的结果： fetch（）正在向同一url发送重复的请求

我认为这可能与fetch（）有关，但也注意到在重新加载应用程序（基于webpack的quasar）时，对http://localhost:8080/sockjs-节点/信息重复

相比之下，我注意到jQuery处理的请求没有重复，而且工作正常

我不能说这是否是由于网页包配置、获取或我使用it I Vue组件的方式造成的错误

例如，本文指出了可能的原因，但在我的案例中，这不是由于用户交互：请求在重新启动应用程序（Web包）时触发，特别是堆栈跟踪显示，请求在创建组件时触发，只是多次

我如何使用

fetch（）

的示例：

//组件-
方法：{
搜索（输入）{
returnnewpromise（resolve=>{//newpromise被多次请求，尽管created（）只调用了一次
var_base='myEndpoint/api'
常量url=`${u base}模糊自动完成？q=${encodeURI（输入）}`
如果（输入长度<3）{
返回解析（[]））
}
fetch（url）//所以承诺实际上是不同的，fetch会触发重复的请求
.then（response=>response.json（））
。然后（数据=>{
console.log（数据）
//解析（data.query.search）
解析（数据）
})
})
},
....
//它应该在创建时只调用一次
创建（）{
this.search（'init first query！！'）；
}

你能建议一下吗

---

与问题无关，但

fetch

返回一个

Promise

，因此不需要将其包装在

Promise

构造函数中。在创建什么时调用一次？创建了多少个对象？

// component - 
    methods : {
       search(input) {
          return new Promise(resolve => {  // a new promise is request multiple times, in spite in created() it is called just once

            var _base = 'myEndpoint/api'
            

            const url = `${_base}fuzzyautocomplete?q=${encodeURI(input)}`

            if (input.length < 3) {
              return resolve([])
            }


            fetch(url)   // so promises are actually different, and duplicated requests are fired by fetch
              .then(response => response.json())
              .then(data => {

                console.log(data)
                // resolve(data.query.search)
                resolve(data)
              })
          })
      },
    ....


// and it should be called just once at time of creation

    created() {
        this.search('init first query !!');
    }