一、基本使用
navigateto是微信小程序中的一个页面跳转方法，主要用于跳转到应用内的非tabBar页面。可以使用该方法传递参数，最多可以携带一个参数，参数的数据类型只支持字符串类型，且需要进行URL编码。下面是一个基本的使用示例：
wx.navigateTo({
url: 'pages/detail/detail?id=' + encodeURIComponent(123)
})
在目标页面的onLoad方法中可以获取参数：
onLoad: function(options) {
var id = decodeURIComponent(options.id);
// do something with id
}
二、多个参数传递
由于navigateto传递参数只支持一个，我们可以将多个参数序列化成一个json字符串，然后再传递该json字符串来实现多个参数的传递。在目标页面可以将获取的json字符串反序列化为json对象，从而获取多个参数。下面是一个示例：
//JSON序列化
var obj = {
id: 123,
name: 'Product Name',
price: 99.99
};
var jsonString = JSON.stringify(obj);
//跳转页面并传递json字符串
wx.navigateTo({
url: 'pages/detail/detail?params=' + encodeURIComponent(jsonString)
});
在目标页面的onLoad方法中获取json字符串并解析：
onLoad: function(options) {
var params = decodeURIComponent(options.params);
var obj = JSON.parse(params);
// do something with obj.id / obj.name / obj.price
}
三、参数校验与默认值设置
在实际开发中，我们需要对传递的参数进行校验。其中一个比较常见的校验是检查传递的参数是否存在以及数据是否合法。如果参数不存在或者数据不合法，我们可以设置默认值。下面是一个示例，该示例对id参数进行校验并设置默认值：
onLoad: function(options) {
var id = options.id;
if (!id || isNaN(id)) {
id = 0;
}
// do something with id
}
在上面的示例中，如果传递的id参数不合法或者不存在，id会被设置为0。这种方法可以保证程序的稳定性，避免出现因为传递参数出现异常而导致的程序崩溃。
四、url参数的拼接
因为navigateto传递参数的方式类似于GET方式，我们也可以使用获取URL参数的方式来进行参数传递。下面是一个示例代码：
var url = 'pages/buy/buy';
var params = {
id: 123,
name: 'Product Name',
price: 99.99
};
var arr = [];
for (var key in params) {
arr.push(key + '=' + encodeURIComponent(params[key]));
}
url += '?' + arr.join('&');
wx.navigateTo({
url: url
});
在上面的示例中，我们首先声明了一个要跳转的页面路径，然后定义了一个包含多个参数的json对象params，最后我们根据params构建了一个URL并使用navigateto方法进行跳转。这种方法可以在多个页面之间进行数据的传递，保证程序的灵活性。
原创文章，作者：小蓝，如若转载，请注明出处：https://www.506064.com/n/245930.html
微信扫一扫 
支付宝扫一扫 