vue.js axios的使用

怼烎@ 2022-04-25 02:26 267阅读 0赞

首先安装 ：npm install axios --save

**vue源码：**

<script>

import axios from '@/axios'               //导入axios

export default \{

data() \{

return \{

List:\[\],             //返回的数据

\};

\},

mounted() \{

this.getList();       //刷新页面自动调用这个方法

\},

methods: \{

getList: function() \{           //定义方法

axios(\{

method: 'post',                       //请求方式是post

url: '/basic/user/getListByData',      //这是后台的接口

data: \{                                        //向后台传送的数据，传送的数据要传送后台需要用的数据

data1: value,

data2: value,

data3: value,

\}

\}).then(res => \{

if (res.data.status == "OK") \{                  //如果后台接口响应成功

this.List = res.data.data.list;      //获取后台返回的数据并赋值给list，我获取的是一个数组，

//res.data.data.list：这个随自己的数据不同而改变，不是固定的

console.log(this.List);              //在控制台打印

\}

\});

\},

\},

\};

</script>

获取的输入如图打印在控制台：

![20190430160441879.png][]

[20190430160441879.png]: /images/20220210/6b6b9c882e8e4eb0b5a8b84a26ccde98.png

发表评论取消回复

表情：

评论列表（有 0 条评论，267人围观）

还没有评论，来说两句吧...

相关阅读

相关 vuejs+layui的使用

Vue2+VueRouter2+webpack+Axios 构建项目实战目录以及文件结构][Vue2_VueRouter2_webpack_Axios] 之前在项目中一...

矫情吗；*/ 2024年04月18日 15:29/ 0 赞/ 71 阅读

相关 axios的基本使用

axios的基本使用 Axios是什么？ -------------------- Axios是什么？ > Axios 是一个基于 promise 的 H

忘是亡心i/ 2024年04月01日 18:44/ 0 赞/ 90 阅读

相关 Vue axios的使用

<template> <div> <div v-if="!repositoryUrl">loading...</div>

忘是亡心i/ 2024年03月03日 06:55/ 0 赞/ 103 阅读

相关 Vuejs与Axios项目开发，简单的网页版的播放器实现

前提说明在这里使用到vue和axios，vue进行数据绑定等，axios进行从连接获取数据。在这里axios获取的链接及api如下： https://autum

拼搏现实的明天。/ 2022年12月08日 05:57/ 0 赞/ 124 阅读

相关【Vuejs】1028- 中 Axios 的封装和 API 接口的管理

![be13bb90966f89e5141f567553dae036.png][] ![bad6f61b0f4c311f1716b718e13efa79.png][] 如图

╰半夏微凉°/ 2022年08月31日 11:12/ 0 赞/ 213 阅读

相关 Vuejs——（８）Vuejs组件的定义

本篇资料来于官方文档： http://cn.vuejs.org/guide/components.html 本文是在官方文档的基础上，更加细致的说明，代码更多更全。

怼烎@/ 2022年07月18日 01:52/ 0 赞/ 329 阅读

相关 vuejs的render方法使用

非使用渲染方法的情况完整代码： <!DOCTYPE html> <html> <head> <title>Vue的r

偏执的太偏执、/ 2022年05月24日 04:55/ 0 赞/ 249 阅读

相关 axios + webpack + vue。 axios基本使用

目的：在wepack+vue 项目中使用 axios 第一步：安装 cnpm i axios -S 第二步：导入 2-1导入：import axi

Dear 丶/ 2022年05月14日 09:20/ 0 赞/ 306 阅读

相关使用axios

axios不是专门为vue设计的，可以应用在各个领域中，所以axios不是vue家族的插件，不能用Vue.use方法来安装使用axios axios实现了p

本是古典何须时尚/ 2021年09月02日 05:17/ 0 赞/ 448 阅读

相关 Axios学习(5)---axios请求的封装与使用

文章目录 Axios学习(5)---axios请求的封装与使用思路分析第一步：新建

秒速五厘米/ 2021年08月02日 16:29/ 0 赞/ 553 阅读