Vue使用如何使用后端的api接口

Vue 使用axios封装后如何调用api接口

小小小白程序员

7078人浏览 · 2022-03-15 22:50:59

小小小白程序员 · 2022-03-15 22:50:59 发布

Vue 如何调用接口 3中方法（封装过axios）

vue 封装axios后如何快速调用 Api接口获取数据
总结

vue 封装axios后如何快速调用 Api接口获取数据

1.通过store仓库调用，获取数据的页面在挂载前发请求，列如：

在这里插入图片描述
拿到接口对外暴露

在这里插入图片描述
引入暴露的接口在actions中

在这里插入图片描述
在页面dispath调用就行了

2.将API挂在全局的原型上

1.在main.js中引入并挂在prototype上
在这里插入图片描述
2.在页面mounted 建立个方法
在methos中使用方法，通过 this. $A P I . x x x . x x x 拿到（我的就是 t h i s .$ API.trademark.reqTradeMarkList）

3.最好用的方法！！！！！！：

1.直接引入暴露的接口
在这里插入图片描述
2.直接对接口使用当然记得传参数

这是我对外暴露的接口.

总结

总的来说各有各的有点，结合使用

对了这是我封装的axios
在这里插入图片描述

Vue

前往低代码交流专区

更多推荐

vue 表单验证

1、6位小写字母和数字必须包含两个字母rules: [{ required: true, message: "XXX不能为空", trigger: "blur" },{ max: 6, message: "最大长度为6位字符", trigger: "blur" },{pattern: /^(?=(?:[^a-z]*[a-z]){2})[a-z0-9]{6,6}$/, //不连续的两位字母// /^