Uniapp 如何获取请求参数

在 Uniapp 开发中，获取请求参数是一项基础且关键的操作，它能让我们根据不同的参数动态地展示内容或执行特定逻辑。以下将详细介绍在 Uniapp 里获取请求参数的方法。

在页面路由方面，Uniapp 提供了便捷的方式来传递和获取参数。当我们通过 navigateTo 或 redirectTo 等 API 进行页面跳转时，可以在 URL 中附带参数。例如：

uni.navigateTo({
  url: '/pages/detail/detail?id=123&name=test'
});

在目标页面获取这些参数时，可利用 onLoad 生命周期函数的参数。在目标页面的 js 文件中：

export default {
  onLoad: function(options) {
    let id = options.id;
    let name = options.name;
    console.log('获取到的id:', id);
    console.log('获取到的name:', name);
  }
}

这种方式简单直接，适用于页面间的参数传递场景。

对于网络请求中的参数获取，当发送 HTTP 请求时，需要携带参数来获取特定数据。以 uni.request 为例：

uni.request({
  url: 'https://example.com/api/data',
  method: 'GET',
  data: {
    category: 'news',
    page: 1
  },
  success: function(res) {
    console.log(res.data);
  }
});

在服务器端接收到请求后，会根据这些参数进行数据查询或处理。而在 Uniapp 中，主要关注的是如何发送正确的参数。

另外，如果是处理 POST 请求的参数，同样使用 uni.request 的 data 字段来设置参数。服务器端会按照相应的协议解析这些参数。

在处理 URL 中的参数时，还可以利用 Vue 的路由守卫等机制，进一步增强对参数的处理逻辑。比如在 beforeEach 守卫中，对路由参数进行校验或预处理。

掌握 Uniapp 中获取请求参数的方法，无论是页面间参数传递还是网络请求参数处理，都能让开发者更高效地开发出功能丰富、交互流畅的应用程序，为用户带来更好的体验。