小胖墩er 小胖墩er
首页
  • 前端文章

    • JavaScript
    • Vue
    • ES6
    • Git
  • Vue
  • React
  • HTML
  • CSS
  • 工具类
  • GitHub技巧
  • 博客搭建
  • 友情链接
💖关于
💻收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)

小胖墩er

Better later than never.
首页
  • 前端文章

    • JavaScript
    • Vue
    • ES6
    • Git
  • Vue
  • React
  • HTML
  • CSS
  • 工具类
  • GitHub技巧
  • 博客搭建
  • 友情链接
💖关于
💻收藏
  • 分类
  • 标签
  • 归档
GitHub (opens new window)
  • 工具类

  • 问题技巧以及优化

    • 问题总结

    • 优化技巧

      • axios发送get请求url传递字符时需要进行编码
      • 当选择某一项时,需要把指定项的值存储起来后使用
      • 优化&运算
      • 优化if语句中相同的代码案例
      • 解决v-for和v-if不能同时使用问题
      • 优化从两个数组中循环判断相等取值操作
  • 博客搭建

  • GitHub技巧

  • 技术
  • 问题技巧以及优化
  • 优化技巧
小胖墩er
2021-09-09

axios发送get请求url传递字符时需要进行编码

如:需要传递某个参数为

platform_status: (APPROVED , FULFILLED_ONLINE , SHIPPED)
orderTotal: [0.0 TO 2.0]
1
2

我们可以在请求拦截器中对参数进行编码操作

// request拦截器
service.interceptors.request.use(
  (config) => {
    if (store.getters.token) {
      config.headers["Authorization"] = getToken(); // 让每个请求携带自定义token 请根据实际情况自行修改
    }

    // get参数编码
    let url = config.url;
    if (config.method === "get" && config.params) {
      url += "?";
      let keys = Object.keys(config.params);
      for (let key of keys) {
        url += `${key}=${encodeURIComponent(config.params[key])}&`;
      }
      // 去掉最后一个&
      url = url.substring(0, url.length - 1);
      config.params = {};
    }
    config.url = url;

    return config;
  },
  (error) => {
    // Do something with request error
    console.log(error); // for debug
    Promise.reject(error);
  }
);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29

注意

因为是在 axios 的拦截器中操作的,所有的 get 请求都有进行操作,可能就会产生不需要传递的参数却传递了空。所以看实际情况进行操作。

在线编辑 (opens new window)
#技巧总结
上次更新: 2021/11/14, 07:48:46
深拷贝
当选择某一项时,需要把指定项的值存储起来后使用

← 深拷贝 当选择某一项时,需要把指定项的值存储起来后使用→

最近更新
01
毛玻璃效果
11-23
02
svg基本绘制
11-23
03
滑动登录界面
11-23
更多文章>
🖥️

© 2021 小胖墩er 💌 粤ICP备2021158933号 🛀 Theme by 💝 Vdoing

  • 跟随系统
  • 浅色模式
  • 深色模式
  • 阅读模式
×