Vue框架基本页面的使用模板

小胡不吃芹菜

已于 2022-08-20 00:25:45 修改

阅读量747

点赞数

分类专栏：前端

于 2022-08-16 19:43:19 首次发布

本文链接：https://blog.csdn.net/m0_65041486/article/details/126373040

版权

Vue.js 模板异步请求 axios 导入方法

关键词由CSDN通过智能技术生成

前端专栏收录该内容

3 篇文章 0 订阅

订阅专栏

vue模板示例：xxx.vue

<template>
    <div id="app">
        
    </div>
</template>

<script>
    //导入需要使用的方法；；格式示例：import {init_course, init_major, init_school} from "@/plugins/work2";
    import {} from "@/xxx/xxx";

    export default {
        name: 'app',
        data() {
            return {
                // 需要的数据
            }
        },
        methods: {
            // element代码所需要的方法的位置
            
        },
        created() {
            
        }
    }
</script>

js文件1：存放各种方法

//这里需要导入外部声明的axios来使用；这样才能发异步请求；这个js文件放在vue项目的plugins目录下
import request from "@/plugins/request";

// 方法格式示例
// export function xxxxx() {
//     return request({
//         url: '',
//         method: 'get',
//     })
// }

js文件2：初始化axios

// 基础版
// import axios from 'axios'

// axios.defaults.headers['Content-Type'] = 'application/json;charset=utf-8'
// // 创建axios实例
// const service = axios.create({
//   // axios中请求配置有baseURL选项，表示请求URL公共部分
//   baseURL: process.env.VUE_APP_BASE_API,
//   // 超时
//   timeout: 10000
// })

// 进阶版：：：：参考别人的吧，我不会

毕竟俺是学后端的，前端的东西实在太难了