东明菏泽网站建设,wordpress布局构建器,学校网站代码模板,租用服务器做视频网站Vue3实践之全局请求URL配置和请求参数说明
全局请求URL配置
1、首先需要导入router和axios
import router from /router;2、创建app#xff0c;将router挂载到app上
const app createApp(App)
app.use(router).use(elementIcons).mount(#app)3、设置全局请求…Vue3实践之全局请求URL配置和请求参数说明
全局请求URL配置
1、首先需要导入router和axios
import router from /router;
2、创建app将router挂载到app上
const app createApp(App)
app.use(router).use(elementIcons).mount(#app)3、设置全局请求路径以及 //设置全局请求地址
let VUE_APP_BASE_DEV_API http://localhost:8092
let VUE_APP_BASE_PRODUCT_API http://localhost:8092//将axios实例绑定到$http属性上
app.config.globalProperties.$http axios//设置请求url
axios.defaults.baseURL VUE_APP_BASE_DEV_API
//设请求头
axios.defaults.headers.common[Content-Type] application/json;charsetUTF-8
//
axios.defaults.headers.post[Accept] application/json4、在vue中使用 //post请求this.$http.post(/scheduler/add-task, this.myJobData).then(reponse {console.log(response:, reponse);}, error {console.log(error, error)});
请求参数说明
Params对象 当需要向 URL 查询字符串添加参数时可以使用 params 字段。这些参数会被序列化并附加到请求 URL 的末尾。适用于 GET 请求等不支持在请求体中传递数据的方法对于数组或对象类型的参数Axios 内部使用 URLSearchParams 或 qs 库如果已配置进行序列化。默认情况下数组会以 arr[]value1arr[]value2 的形式传递。如果需要自定义序列化规则可以使用第三方库如 qs自行处理 data对象适用于 POST、PUT、PATCH 请求 对于需要在请求体中传递数据的 HTTP 方法如 POST、PUT、PATCH可以使用 data 字段。数据可以是 JSON 对象、FormData 对象、字符串或者其他格式具体取决于 Content-Type 设置
Post请求示例 //this.myJobData就是上面所说的data对象this.$http.post(/scheduler/add-task, this.myJobData).then(reponse {console.log(response:, reponse);}, error {console.log(error, error)});Get请求示例 this.$http.get(/scheduler/list, {params: {id: 123, name: 张三}}).then(response {console.log(data:, response.data.data)console.log(data:, response.data)this.tableData response.data}, error {console.log(error.message);});不管是何种请求后端接收时需要保证属性名一致或者使用注解指定请求参数的名称。
