笔记大全

uniapp获取请求的参数

更新时间：2023-07-07

UniApp 是一个跨平台开发框架，一般在开发过程中需要获取请求的参数。本文主要通过代码示例，讲解 UniApp 获取请求参数的方法。本文将以 POST 请求为例，详细介绍获取方法，掌握方法，有利于在实际开发中高效地使用。 ### 1. 在请求头中获取参数请求的参数可能是存在请求头中的，这时候我们可以直接请求头中对应字段值即可获取。示例代码如下： ```html

在请求头中获取参数

示例中我们设请求头的字段为 Authorization ，通过 XMLHttpRequest 的 getResponseHeader 方法获取。

  <script>
    uni.request({
      url: 'https://api.xxxx.com',
      method: 'POST',
      header: {
        "Authorization": "abcd"
      },
      success: (res) => {
        const headers = res.header;
        const authorization = headers.Authorization;
        console.log('参数是：' + authorization);
      }
    });
  </script>

``` ### 2. 通过 url 直接获取参数当表单提交时，输入框中的参数被组合成一个 URL。这时我们可以通过编写正则表达式提取对应的参数，实现获取参数的效果。示例代码如下： ```html

通过 URL 直接获取参数

通过正则表达式解析 url 找出 param 参数对应的值

  <script>
    const reg = new RegExp("(^|&)param=([^&]*)(&|$)");
    const url = "https://api.xxxx.com?param=abc&user=xxx";
    const result = url.substr(1).match(reg);
    if (result && result.length > 2) {
      console.log('参数是：' + decodeURIComponent(result[2]));
    }
  </script>

``` ### 3. 通过表单元素获取参数如果是使用表单提交数据，我们可以通过使用 FormData 对象来获取表单的数据，然后获取请求的参数。示例代码如下： ```html

通过表单元素获取参数

通过表单名获取元素，遍历获取表单数据，进而获取表单元素的 name 和 value 并将其存储到 JSON 对象中

  <template>
    <form ref="form" v-on:submit.prevent="submit">
      <input name="username" />
      <button type="submit">提交</button>
    </form>
  </template>

  <script>
    export default {
      methods: {
        submit: function() {
          const json = {};
          const formData = new FormData(this.$refs.form);
          formData.forEach((value, key) => {
            json[key] = value;
          });
          console.log('参数是：' + JSON.stringify(json));
        },
      }
    }
  </script>

``` ### 4. 通过 Vue Router 获取参数在开发中，有可能使用 UniApp 和 Vue Router 进行路由传参。UniApp 可以通过 $route 接口访问 Vue Router 对象，从而获取路由参数，示例代码如下： ```html

通过 Vue Router 获取参数

使用 UniApp 内置的 $route 获取到路由参数并展示出。

  <template>
    <div>参数是：{{$route.query.param}}</div>
  </template>

  <script>
    export default {
      onLoad(args, params) {
        console.log('参数是：' + this.$route.query.param);
      },
    }
  </script>

``` 本篇文章主要介绍了 UniApp 获取请求参数的方法，并通过示例代码进行阐述和操作，同时通过分析不同的获取方式，可以选择相应的方法来获取参数，提高应用程序的开发效率和开发质量。

c语言编程笔录