VUE中提取公共方法

发布于 2022-09-11 16:22:51 字数 400 浏览 25 评论 0

写一个ajax请求方法,在组件中正常,提取到公共方法的文件中就不正常啦,就报Cannot read property “$http ”of undefined",这个到底是怎么回事?我研究一天啦,也没有找到解决办法,请求帮助

这个是公共方法(common.js):

图片描述

页面的调用方法(rank.vue):

图片描述

报错的情况:
图片描述

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(6

赴月观长安 2022-09-18 16:22:51
function API (prefix) {
  this.prefix = prefix
};

API.prototype.request = function (url, options) {
  url = this.prefix + url
  ... do the request
}

API.install = function (Vue, options) {
  var api = new API(options.prefix)
  Vue.prototype.$api = api
  Vue.api = api
}
这样的小城市 2022-09-18 16:22:51
const RequestAPI = Request.bind(this)
// 使用RequestAPI
RequestAPI();
思念绕指尖 2022-09-18 16:22:51

你的公共方法的this根本指的不是VUE的实例,你this能找到$http和store就有鬼了。。。。。你外部js包,不导入需要的依赖,就直接调用么?你这里的this指向的是Request。
import XXXX from 'XXXX'
把你需要的东西引入再用。

有空多补补js基础

权谋诡计 2022-09-18 16:22:51
先引用,然后使用
import axios from 'axios'
axios.get('url').then((res)=>{
    
 }).catch((err)=>{})
南汐寒笙箫 2022-09-18 16:22:51

this.$http改成Vue.prototype.$http,别忘了import Vue

南笙 2022-09-18 16:22:51

this.$http中的this无法指向vue实例,楼上正解。
解决方法,可以将vue实例作为request函数的参数传进来,request(this)

~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文