第一次接手项目,传参方式还有些吃力,因此做一下总结。

首先我们需要会看swagger中的接口。里面写了某个接口需要接收什么样的值,前端怎么传递这个值

在mock中的传参方式:

mock中传参的方式有两个参数,一个是path对象,一个是data对象。

path想当于拼接在url地址上的参数,

data是url后面的参数。

1、get请求

如果url后面有opts的参数,则说明他需要传递参数。要不就不用传递了,直接写个url就好了,不用拼接参数。(请看下图)

图一是接口

图二是调用了这个接口。

这个get请求中拼接了参数,get中参数的拼接是和url拼接在一块。opts中的path属性是用来在url中进行拼接的,path中写入你需要拼接的参数。

实际上mock和axios的方式大致是一样的,他们都是基于promise对象来使用的,他们返回的是一个promise对象,所以可以用.then。then方法中的参

数就是后端返回给咱们的数据。

2、post请求

接口:

3、put传参

他传参的方式同post是一样滴。这里就不赘述了。

axios传参的方式:

在介绍axios传参时需要介绍一种字符串的另一种表达形式---模板字符串

模板字符串就是字符串的另一种表达形式。

用``包裹起来的就是字符串就是模板字符串,如果字符串${id}代表的就是拼接的变量名,这样就不用加连接符了,

下面时实例。

1、get请求

2、post请求

注意data是一个对象哈。

3、delete请求

delete实际上和get请求的传递方式是一样的。

mock和axios常见的传参方式的更多相关文章

  1. axios中post传参方式

    最近做vue项目,做图片上传的功能,使用get给后台发送数据,后台能收到,使用post给后台发送图片信息的时候,vue axios post请求发送图片base64编码给后台报错HTTP 错误 414 ...

  2. jQuery对象初始化的传参方式

    jQuery对象初始化的传参方式包括: 1.$(DOMElement) 2.$(' ... '), $('#id'), $('.class') 传入字符串, 这是最常见的形式, 这种传参数经常也传入第 ...

  3. java 传参方式--值传递还是引用传递

    java 传参方式--值传递还是引用传递 参数是按值而不是按引用传递的说明 Java 应用程序有且仅有的一种参数传递机制,即按值传递.写它是为了揭穿普遍存在的一种神话,即认为 Java 应用程序按引用 ...

  4. axios的各种传参方式

    axios的各种传参方式 1. params方式 axios({ url: '/users', method: 'get', params: { id: '11111', name: '22222' ...

  5. axios用post传参,后端无法获取参数问题

    最近用vue+nodejs写项目,前端使用axios向后台传参,发现后台接收不到参数. 后台是node+express框架,然后使用了body-parser包接收参数,配置如下: const expr ...

  6. angularjs简单实现$http.post(CORS)跨域及$http.post传参方式模拟jQuery.post

    1.开启angularjs的CORS支持 .config(function($httpProvider) { // CORS post跨域配置 $httpProvider.defaults.useXD ...

  7. react中的传参方式

    react是一个SPA模式,即组件嵌套租,在一个单页面的应用中组件间的数值传递是必不可少的,主要的传参方式大致有一下几种: 1,在挂载的地方给组件传参 ReactDOM.rander(<a na ...

  8. Web API中的传参方式

    在Restful风格的WebApi的里面,API服务的增删改查,分别对应着Http Method的Get / Post / Delete /Put,下面简单总结了Get / Post /Delete ...

  9. Python函数定义及传参方式

    主要内容:     1.函数初识     2.函数传参方式        (1)位置参数        (2)默认参数        (3)关键参数        (4)非固定传参 一.函数初识 1. ...

随机推荐

  1. jQuery三级联动效果代码(省、市、区)

    很长时间都不用jquery了,有人问我jquery写三级联动的插件我就写好了发出来吧,正好需要的人都可以看看. 一.html代码 <!DOCTYPE html> <html> ...

  2. 死磕 java线程系列之创建线程的8种方式

    (手机横屏看源码更方便) 问题 (1)创建线程有哪几种方式? (2)它们分别有什么运用场景? 简介 创建线程,是多线程编程中最基本的操作,彤哥总结了一下,大概有8种创建线程的方式,你知道吗? 继承Th ...

  3. VR应用评测 - Google Spotlight Story: Sonaria

    Google Spotlight Story: Sonaria 一个5min左右的VR小电影,坐姿观看,但是用户其实可以移动+旋转视角.画面很抽象,所有的物体都由基本的单色几何形状组成,主角是两个一公 ...

  4. 函数的return和参数

    1.函数 将一些代码进行封装 def 函数名 括号 冒号:#创建 函数体(代码块) 函数名 + 小括号 #调用 1.1函数的返回值 return return 不写返回的是None,return写了不 ...

  5. 浅谈Java的内存模型以及交互

    本文的内存模型只写虚拟机内存模型,物理机的不予描述. Java内存模型 在Java中,虚拟机将运行时区域分成6中,如下图:              程序计数器:用来记录当前线程执行到哪一步操作.在多 ...

  6. Python 爬虫(四):Selenium 框架

    Selenium 是一个用于测试 Web 应用程序的框架,该框架测试直接在浏览器中运行,就像真实用户操作一样.它支持多种平台:Windows.Linux.Mac,支持多种语言:Python.Perl. ...

  7. php企业微信获取员工userid以及打卡信息

    企业微信可以通过部门列表获取部门下的员工信息,从而获取到员工的userid //首先获取需要的access_token $access_token = json_decode($this->ge ...

  8. 02-19 k近邻算法(鸢尾花分类)

    [TOC] 更新.更全的<机器学习>的更新网站,更有python.go.数据结构与算法.爬虫.人工智能教学等着你:https://www.cnblogs.com/nickchen121/ ...

  9. A-01 最小二乘法

    目录 最小二乘法 一.最小二乘法--代数法 二.最小二乘法--矩阵法 三.最小二乘法优缺点 3.1 优点 3.2 缺点 更新.更全的<机器学习>的更新网站,更有python.go.数据结构 ...

  10. MQTT介绍与使用

    物联网是新一代信息技术的重要组成部分,也是“信息化”时代的重要发展阶段.其英文名称是:“Internet of things(IoT)”.顾名思义,物联网就是物物相连的互联网.这有两层意思:其一,物联 ...