美文网首页
vue axios 传递数组到后台

vue axios 传递数组到后台

作者: flyjar | 来源:发表于2020-10-12 07:49 被阅读0次
    import Vue from 'vue'
    import axios from 'axios'
    import router from '@/router'
    import qs from 'qs'
    import merge from 'lodash/merge'
    import { clearLoginInfo } from '@/utils'
    
    const http = axios.create({
      timeout: 1000 * 30,
      withCredentials: true,
      headers: {
        'Content-Type': 'application/x-www-form-urlencoded; charset=utf-8'
      }
    })
    
    /**
     * 请求拦截
     */
    http.interceptors.request.use(config => {
      config.headers['token'] = Vue.cookie.get('token') // 请求头带上token
      return config
    }, error => {
      return Promise.reject(error)
    })
    
    /**
     * 响应拦截
     */
    http.interceptors.response.use(response => {
      if (response.data && response.data.code === 401) { // 401, token失效
      
        /**
         * 如果当前token为空,代表我第一访问的时候token就是空的
         */
        clearLoginInfo()
        //state=1.表示token
        router.push({ name: 'login'})
      }
      return response
    }, error => {
      return Promise.reject(error)
    })
    
    /**
     * 请求地址处理
     * @param {*} actionName action方法名称
     */
    http.adornUrl = (actionName) => {
      // 非生产环境 && 开启代理, 接口前缀统一使用[/proxyApi/]前缀做代理拦截!
      return (process.env.NODE_ENV !== 'production' && process.env.OPEN_PROXY ? '/proxyApi/' : window.SITE_CONFIG.baseUrl) + actionName
    }
    
    
    //这里是处理数组的方法
    http.adornDataArray = (data = {}) => {
      var defaults = {
        't': new Date().getTime()
      }
      data =  merge(defaults, data)
      return qs.stringify(data,{arrayFormat: 'brackets'})
    }
    
    
    export default http
    
    
    ids的格式是这样的[1,2,3,4,5,6]
    处理数组  this.$http.adornDataArray({ ids: ids })
    this.$http({
                url: this.$http.adornUrl("/otMenuPermission/delete/"),
                method: "post",
                data: this.$http.adornDataArray({ ids: ids }),
              }).then(({ data }) => {
                if (data && data.code === 0) {
                  if (form) {
                    this.getShareDataList();
                  } else {
                    this.getCreateDataList();
                  }
                  this.$message({
                    message: "操作成功",
                    type: "success",
                    duration: 1500,
                  });
                } else {
                  this.$message.error(data.msg);
                }
              });
            })
            .catch(() => {});
    
      //后台的接受
      @SysAdminPermission
        @SysLog("删除菜单权限")
        @PostMapping(value = "/delete")
        @ApiOperation(value = "删除菜单权限")
        @ApiImplicitParam(value = "菜单权限ids", name = "ids", required = true, paramType = "query")
        public R deleteMenuPermission(@RequestParam(value = "ids[]") Long[] ids) {
            otMenuPermissionService.removeByIds(Arrays.asList(ids));
            return R.ok();
        }
    
    

    相关文章

      网友评论

          本文标题:vue axios 传递数组到后台

          本文链接:https://www.haomeiwen.com/subject/pudcyktx.html