如何实现这样的axios API查询参数

Question

这是我第一次发现这样的API，params键中的表单就像一个数组，但可能不是数组，它是如何在axios中实现的？

｛baseUrl｝/列表？filter[v3_p.name]=包数据&filter[pro.name]=Indosat&filter[pp.category]=凭证&filter[pd.is_enable]=1

我在axios中的代码如下：

export const filterProduk = (data) => async (dispatch) => {
try {
const params = { filter: data }
const res = await axios.get(`${baseUrl}/list`, data, {
params,
paramsSerializer: function paramsSerializer(params) {
return Object.entries(Object.assign({}, params, { filter: 'HIDDEN' })).map(([key, value]) => `${key}=${value}`).join('&')
}
});
dispatch({
type: FILTER_SUCCESS,
payload: res.data.data
});
} catch (error) {
dispatch({
type: FILTER_FAILED,
payload: error.response.data,
});
}
};

我也试过

export const filterProduk = (data) => async (dispatch) => {
try {
const res = await axios.get(`${baseUrl}/list`, data, {
params: {
filter: [data.package, data.provider, data.category, data.is_enable]
}
});
dispatch({
type: FILTER_SUCCESS,
payload: res.data.data
});
} catch (error) {
dispatch({
type: FILTER_FAILED,
payload: error.response.data,
});
}
};

我没有在任何文档中得到它，希望在这里得到答案！谢谢

Answer 1

您可以使用qs.stringify来序列化参数。您应该将config对象作为第二个参数传递给axios.get。

axios.get(`${baseUrl}/list`, {
params,
paramsSerializer: (params) => qs.stringify(params, { encode: false }),
})

---

建议：您可以使用axios.defaults.baseURL设置API基本URL，或者创建一个自定义axios实例并对其进行配置，以避免在每次调用中都必须键入它。

// axios.js
import axios from 'axios'
export default axios.create({
baseURL: 'https://api.example.com'
})
// queries.js
import axios from './axios'
axios.get('/list', {
params,
paramsSerializer: (params) => qs.stringify(params, { encode: false }),
})