vue mixins处理统一封装的axios

最新推荐文章于 2024-05-17 14:32:46 发布

Miya锤

最新推荐文章于 2024-05-17 14:32:46 发布

阅读量108

点赞数

文章标签： vue.js javascript 前端

本文链接：https://blog.csdn.net/weixin_45599105/article/details/130012250

版权

目的是为了多个组件中使用同一个axios方便，不用每个组件中都import一遍balabla

1.建个文件，我的api下是封装好的axios，commonvuejs作为mixins
在这里插入图片描述
2.在commonvuejs

<script>
import { weiboPicUrlAPI } from "../../api/WsendQuestion";//引入封装axiosApi
export default {
  name: "mixins-test-main",
  props: {},
  methods: {
    async weiboPicUrlAPI(data) {
      let res = await weiboPicUrlAPI(data);
      return res.data;
    },
  },
};
</script>

3.在页面使用

<script>
import commonvuejs from "../assets/js/commonvuejs.vue";//引入mixins文件
export default {
  mixins: [commonvuejs],
  mounted() {
    this.weiboPicUrlAPI();//直接使用
  },
</script>