【Vue3.0移动端项目--旅游网】-- 城市页面搭建

2022-10-11 217

版权

本文内容由阿里云实名注册用户自发贡献，版权归原作者所有，阿里云开发者社区不拥有其著作权，亦不承担相应法律责任。具体规则请查看《阿里云开发者社区用户服务协议》和《阿里云开发者社区知识产权保护指引》。如果您发现本社区中有涉嫌抄袭的内容，填写侵权投诉表单进行举报，一经查实，本社区将立刻删除涉嫌侵权内容。

简介： 【Vue3.0移动端项目--旅游网】-- 城市页面搭建

新建 city 分支

通过 Git 管理项目，养成良好的开发习惯，可以创建分支。最后开发完可以合并分支。

1.创建新分支并且跳转到改分支上

git checkout -b city

2.查看分支

git branch

微信图片_20221011220043.png

封装网络请求 axios（补充）

如果不封装 axios 也可以直接依赖 axios 发送请求，但是为了方便开发，我们队对 axios 做一层封装，一次封装以后都可以直接拷贝使用。

1.安装axios

npm install axios

2.创建 config.js (网络请求基本配置文件)

export const BASE_URL = "http://123.207.32.32:1888/api"
export const TIMEOUT = 10000

3.创建request/index.js(对axios进行封装)

import axios from "axios"
import { BASE_URL, TIMEOUT } from "./config.js"
class CXRequest {
  constructor(baseURL, timeout = 10000) {
    this.instance = axios.create({
      baseURL,
      timeout
    })
  }
  request(config) {
    return new Promise((resolve, reject) => {
      this.instance
        .request(config)
        .then(res => {
          resolve(res.data)
        })
        .catch(err => {
          reject(err)
        })
    })
  }
  get(config) {
    return this.request({ ...config, method: "get" })
  }
  post(config) {
    return this.request({ ...config, method: "post" })
  }
}
export default new CXRequest(BASE_URL, TIMEOUT)