首页 > 其他分享 >Vue - axios

Vue - axios

时间:2022-10-27 23:44:32浏览次数:52  
标签:function www axios 请求 api Vue result

Axios 

发送GET请求

 

      axios({
          // 请求方式
          method: "GET",
          // 请求地址
          url: "http://www.liulongbin.top:3006/api/getbooks",
          // URL中的查询参数
          params: {
            id: 2,
          },
        }).then(function(result) {
            console.log(result);
        })
      });

 

发送post请求

<!DOCTYPE html>
<html lang="en">
  <head>
    <meta charset="UTF-8" />
    <meta http-equiv="X-UA-Compatible" content="IE=edge" />
    <meta name="viewport" content="width=device-width, initial-scale=1.0" />
    <title>Document</title>
  </head>
  <body>
    <button id="btnPost">发送POST请求</button>
    <!-- 引入axios -->
    <script src="/lib/axios.js"></script>
    <script>


      document.querySelector('#btnPost').addEventListener('click', function() {
        axios({
            method: 'POST',
            url: 'http://www.liulongbin.top:3006/api/post',
            // 请求体参数
            data: {
                name: 'zs',
                age: 12,
            }
        }).then(function(result) {
            console.log(result);
        })
      })
    </script>
  </body>
</html>

 

标签:function,www,axios,请求,api,Vue,result
From: https://www.cnblogs.com/ZhuAo/p/16834413.html

相关文章

  • #yyds干货盘点#vue的防抖
    在监听频繁触发的事件时,一定要多加小心,比如用户在输入框打字、窗口大小调整、滚动、IntersectionObserver事件。这些事件总是被频繁触发,可能几秒一次。如果针对每次事件......
  • new: 轮播图 | MDN上HTML的总结和CSS面试题解答,以及vue-admin/豆瓣一个静态页面的实现
    主要参看oppo官网https://www.oppo.com/cn/,实现以下功能一、轮播图https://www.cnblogs.com/WindrunnerMax/p/12638005.html通常是在首页读秒播放的图片,本次了解的是opp......
  • vue项目总结
    项目总结在进行网站数据请求的过程中,面临接口实时刷新的情况,数据请求过期解决:将最新请求出来的数据本地存储便于页面渲染再用到项目中所需要的组件有问题时,学会查看......
  • vue-element-admin框架学习笔记
    0背景vue-element-admin是一个已高度完成的系统原型,它基于vue框架和elementUI组件库。它使用最新的前端技术栈,内置i18n国际化解决方案、动态路由、权限验证。它可以帮助......
  • Vue学习笔记之使用computed计算属性
    0x00概述本文主要记录Vue页面使用computed计算属性0x01computed基本使用在computed中定义一个函数(看起来是一个函数,其实是一个属性),命名按照属性规范命名(一般为名词)......
  • Vue学习笔记之scope.row的最简单理解
    0x00概述本文转载,仅做记录用,原文 0x01表格内开关选项如果表单中只是对返回数据的字面量的显示,prop和slot-scope没有大的差异,开发过程中基本可以通用;但是如果有一个......
  • vue中v-for写在template上,加key提示错误
    v-for写在非template上,添加:key没有任何问题,但是写在template上就不行了,加了就报错虽然不影响页面渲染,但终端一直报错显示,很讨厌;有时候,页面渲染,还是需要不加div层的基础......
  • vue2 使用video.js
    页面内使用//外层div<divclass="video-class"v-if="isShowVideoDialog"><!--<videowidth="100%"height="100%"controls:src="playUrl"></video>--><video......
  • vue.config.js 学习记录
    Vue-cli4将webpack深度集成,不对外展示webpack具体配置,在vue.config.js中可以更改配置:Vue.config.js的基本内容为:module.exports={ publicPath:'/smart-dispa......
  • Vue3 Composition API
    一、响应式基础前提:你会使用setup函数或<scriptsetup>语法1.reactive我们可以使用reactive()函数创建一个响应式对象或数组:import{reactive}from'vue'c......