uniapp如何实现跳转页面回传数据

uniapp实现跳转页面回传数据的方法:首先给点击事件传入id;然后在Methods中写方法,代码为【uni.navigateTo({url:’opportunity-form?id=’+id})】;最后在详情页接收参数。

uniapp如何实现跳转页面回传数据

本教程操作环境:windows7系统、uni-app2.5.1版本,DELL G3电脑,该方法适用于所有品牌电脑。

推荐(免费):uni-app开发教程

uniapp实现跳转页面回传数据的方法:

首先介绍最原始的跳转方法,类似于html中的 a 标签,不过在uniapp中需要将 a 标签换成……

下面我们来重点介绍下跳转传值的方法

1、给点击事件传入id

转商机;

登录后复制

2、Methods中写方法

toOpportnity(id){uni.navigateTo({        //点击跳转的方法url:'opportunity-form?id='+id     //需要跳转的页面路径,使用问号进行id的传值,然后再拼接一个要传入的id//对象传参方式 url:'../../pages/disabled/subsidie?listObj=' + encodeURIComponent(JSON.stringify(obj))})}

登录后复制

3、详情页接收参数

写一个onLoad函数

onLoad(options){    //传入的参数名称,可自行修改// console.log(options);    查看传入的id值

登录后复制

对象传参的接收方法

//this.leadobj(上个页面传过来的对象名称,即?后面的那个名称) = JSON.parse(decodeURIComponent(options.leadobj));   }

登录后复制

单个参数的接收,这里使用id来进行介绍

首先要把传递过来的id进行赋值

请求接口,接口的url地址后面要加上传递过来的id【/${this.id}/】

完整步骤如下:

onLoad(options){this.id = options.id;console.log('传过来的id值为:' + options.id);let that = thisuni.request({url:`${this.$serverUrl}/opportunity/${this.id}/`,header:{'Authorization': this.uerInfo.token},success(res){console.log(res)that.opportunity = res.data;}})}对象传参报错解决方案

登录后复制

相关免费学习推荐:uni-app开发教程

以上就是uniapp如何实现跳转页面回传数据的详细内容,更多请关注【创想鸟】其它相关文章!

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容, 请发送邮件至253000106@qq.com举报,一经查实,本站将立刻删除。

发布者:PHP中文网,转转请注明出处:https://www.chuangxiangniao.com/p/3032342.html

(0)
上一篇 2025年3月13日 08:43:38
下一篇 2025年3月6日 15:22:39

AD推荐 黄金广告位招租... 更多推荐

相关推荐

  • uniapp如何将图片转base64

    uniapp将图片转base64的方法:首先选择图片返回的相对路径;然后设置编码格式,代码为【filePath: url,encoding: ‘base64’,success: res => {console.…

    2025年3月13日
    200
  • uniapp如何判断运行环境

    uniapp判断运行环境的方法:可通过【process.env.NODE_ENV】判断当前环境是开发环境还是生产环境,代码为【if(process.env.NODE_ENV === ‘development’){co…

    2025年3月13日
    200
  • uniapp如何判断手机定位是否开启

    uniapp判断手机定位是否开启的方法:首先获取系统信息;然后判断平台,代码为【let system = uni.getSystemInfoSync();if (system.platform === ‘android&#821…

    2025年3月13日
    200
  • uniapp同步缓存失效怎么办

    uniapp同步缓存失效的解决办法:1、设置存,代码为【uni.setStorageSync(‘storage_key’, ‘hello’)】;2、获取当前storage的相关信息,代码为【c…

    2025年3月13日
    200
  • uniapp如何实现页面地址跳转

    uniapp实现页面地址跳转的方法:1、使用navigator标签,代码为【】;2、使用【@tap】事件跳转。 本教程操作环境:windows7系统、uni-app2.5.1版本、thinkpad t480电脑。 推荐(免费):uni-ap…

    2025年3月13日
    200
  • uniapp怎么使用组件

    uniapp使用组件的方法:1、使用props用于父组件给子组件传递参数;2、使用【$emit】用于向父组件传递事件,可携带子组件的参数;3、使用ref获取某个dom节点或子组件的注册引用信息。 本教程操作环境:windows7系统、uni…

    2025年3月13日
    200
  • uniapp如何封装公用方法

    实现uniapp封装公用方法:首先创建uni-app,并新建页面文件;然后新建封装文件,并定义封装方法;接着页面调用方法;最后保存编译预览即可。 本教程操作环境:windows7系统、uni-app2.5.1版本,该方法适用于所有品牌电脑。…

    2025年3月13日 编程技术
    200
  • uniapp如何设置view背景图

    uniapp设置view背景图的方法:可以通过设置view的background或者【background-image】属性来实现,代码为【 本教程操作环境:windows7系统、uni-app2.5.1版本、Dell G3电脑。 推荐(免…

    2025年3月13日
    200
  • uniapp如何设置代理

    uniapp设置代理的方法:首先打开HbuilderX找到【manifest.json】文件;然后找到h5位置的配置信息,增加代理配置信息;最后重启项目即可。 本教程操作环境:windows7系统、uni-app2.5.1版本、thinkp…

    2025年3月13日
    200
  • uniapp如何将输入值转成大写

    uniapp将输入值转成大写的方法:首先过滤不需要的字符,只保留数字和字母;然后通过“if (!/^[A-Zd]+$/.test(val)) {…}”方式将字符小写转为大写;最后通过return输出值即可。 本教程操作环境:wi…

    2025年3月13日
    200

发表回复

登录后才能评论