vue如何动态更改url接口地址

上传图片的接口地址如下,想在不同页面调用的时候在接口地址后面拼上不同的名字,比如当前页面我想调用这个/api/b2bmall/v1.0/file/upload/img/customer,在调用接口的地方应该这么做修改,感谢各位

import request from '@/utils/request'

//上传图片
export function uploadImg(data) {
  return request({
    url:'/api/b2bmall/v1.0/file/upload/img',
    method:'post',
    data:data,
    headers:{
        'Content-Type': 'multipart/form-data', // 默认值
    }
  })
}
  uploadImg(formData).then(response=>{
           console.log(response)
         })
阅读 5.3k
2 个回答
import request from '@/utils/request'

//上传图片
export function uploadImg(data, x) {
  return request({
    url:`/api/b2bmall/v1.0/file/upload/img/${x}`,
    method:'post',
    data:data,
    headers:{
        'Content-Type': 'multipart/form-data', // 默认值
    }
  })
}
uploadImg(formData, 'customer').then(response=>{
   console.log(response)
 })

可以把请求用一个文件整理好,页面中直接调用就行了。

类似建一个api.js文件。这样方便管理,到时修改、新增接口地址的时候,直接改这个文件就行了。页面上只需传递所需的参数就行了。
例如:

import request from '@/utils/request'

export const uploadImg = (params) => request({
    url:'/api/b2bmall/v1.0/file/upload/img',
    method:'post',
    data:params,
})

export const uploadCustomerImg = (params) => request({
    url:'/api/b2bmall/v1.0/file/upload/img/customer',
    method:'post',
    data:params,
})

然后在页面上使用

import { uploadCustomerImg } from '@/api';

<script>
export default {
    methods: {
        getData() {
            uploadCustomerImg('参数').then(res=>{})
        }
    }    
}
</script>
撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题