探索quasar

今日开启了探索quasar之旅。听说quasar比其他框架更适合偏向后端的程序员。可以尽量减少布局等内容耗费的时间。

 今日第一篇,引入axios。

由于是vue3所以使用typescript。

1.在src创建目录lib,创建文件axios.ts 内容如下。

import libAxios from 'axios'
// axios网络请求封装请求开始
const axios = libAxios.create({
  // baseURL: process.env.API_ROOT,
  timeout: 15000,
  withCredentials: false,
  headers: {
    'Content-Type': 'application/json;charset=utf-8',
    'Access-Control-Allow-Headers': 'X-Requested-With,Content-Type',
    'Access-Control-Allow-Methods': 'OPTIONS, GET, POST'
  }
})
export default axios

2.创建好后,会有跨域问题,我们来解决一下

 打开quasar.config.js 配置devServer

    devServer: {
      https: false,
      open: true, // opens browser window automatically
      port: 8080,
      proxy: {
        '/api': {
          target: 'http://localhost:44347',
          changeOrigin: true
        }
      }
    }

 3.调用方法

import  axios  from 'src/lib/axios'

  axios.get("/api/app/test/now")
      .then((response) => {
        console.log("response is:");
        console.log(response.data)
      })
      .catch(() => {
        console.log("got error");
      })

  

 

posted on 2022-12-13 14:01  GilChen  阅读(125)  评论(0编辑  收藏  举报