uni-app页面传参(非tabBar页面)

uni-app页面传参(非tabBar页面)

1.开发环境 uni-app
2.电脑系统 windows10专业版
3.使用 navigator 方法进行传参,在template中添加如下代码:

去首页的详情页
//注意:在这里我使用了模板字符串的方法,这样可以使 title 作为一个变量,不然的话,会被识别为一个字符串

4.在 indexcon 页面中,在 onLoad中进行接受,代码如下:

onLoad(options) {
            console.log(options);
        },
 //使用 options 接受传递过来的参数

5.效果如下:
uni-app页面传参(非tabBar页面)_第1张图片
6.但是在开发的过程中,我们肯定不会只传一个参数,我们一般会传多个参数,在这里我选择的是,使用对象的方法!
7.在template 中修改代码为:

去首页的详情页

8.在return中添加如下代码:

ChenindexconOnj:{
                    'id':'100',
                    'name':'chen',
                    'sex':'男',
                    'age':'23',
                },

9.在 indexcon 输出接受到的对象,效果如下:
uni-app页面传参(非tabBar页面)_第2张图片

根据输出这个结果,我们可以得出结论,这个方法可以识别字符串,解决方法如下

10.在 onLoad中添加如下代码:

onLoad() {
            this.ChenindexconOnj=JSON.stringify(this.ChenindexconOnj);
 },
 // JSON.stringify(this.ChenindexconOnj) //作用:把这个变量转换为字符串

11.再次测试,效果如下:
uni-app页面传参(非tabBar页面)_第3张图片
12.本期的分享到了这里就结束啦,希望对你有所帮助,让我们一起努力走向巅峰!

你可能感兴趣的