成都网站建设设计

将想法与焦点和您一起共享

微信小程序怎么实现动态传参

这篇文章主要讲解了“微信小程序怎么实现动态传参”,文中的讲解内容简单清晰,易于学习与理解,下面请大家跟着小编的思路慢慢深入,一起来研究和学习“微信小程序怎么实现动态传参”吧!

成都创新互联公司专注为客户提供全方位的互联网综合服务,包含不限于成都网站建设、成都网站制作、新沂网络推广、成都小程序开发、新沂网络营销、新沂企业策划、新沂品牌公关、搜索引擎seo、人物专访、企业宣传片、企业代运营等,从售前售中售后,我们都将竭诚为您服务,您的肯定,是我们最大的嘉奖;成都创新互联公司为所有大学生创业者提供新沂建站搭建服务,24小时服务热线:13518219792,官方网址:www.cdcxhl.com

微信小程序 动态传参实例详解

跳转这里采用navigator跳转,在navigator跳转的链接上将参数加上去:

index.wxml(根据点击页面的不同传递参数)

 
  
  
  {item.MTId}} {{item.status}} 
  
  

id是在本地数据中已经写好的,它也对应了每一条数据其他详细信息。由此可以想到,我们只要在下一级页面根据传递参数id再在本地数据中查询,然后将查询结果进行显示,就做到了加载详细信息这个功能。

logs.js(接受index.wxml传递的参数并处理)

Page({ 
 onLoad: function (options) { 
 console.log(options.id) 
 var init = myData.searchmtdata(options.id) 
 this.setData({ 
  data_MTId: init.MTId, 
  data_status: init.status, 
  data_duration: init.Duration, 
  data_Operator: init.Operator, 
  data_IdleReason: init.IdleReason 
 }) 
 } 
})

searchmtdata这个方法在之前的博客中已经有说明,就是根据id的值来查询,返回一个list中具体的对象,即某个item的详细信息。

onLoad:function这个函数在页面加载时就会执行一次,options就是接收的从index.wxml传递过来的参数。根据id查询到具体的list对象后再进行赋值,此时data_**中的数据就是某个item的详细信息了。

logs.wxml(对item的详细信息进行显示)

 
 MTID 
 {{data_MTId}} 
 
 
 Status 
 {{ data_status}} 
 
 
 Duration 
 {{data_duration}} 
 
 
 Operator 
 {{data_Operator}} 
 
 
 Idle Reason 
 {{data_IdleReason}} 

实现效果截图:

微信小程序怎么实现动态传参

点击具体某个item

微信小程序怎么实现动态传参

感谢各位的阅读,以上就是“微信小程序怎么实现动态传参”的内容了,经过本文的学习后,相信大家对微信小程序怎么实现动态传参这一问题有了更深刻的体会,具体使用情况还需要大家实践验证。这里是创新互联,小编将为大家推送更多相关知识点的文章,欢迎关注!


网页名称:微信小程序怎么实现动态传参
浏览路径:http://chengdu.cdxwcx.cn/article/gegphd.html