浅谈小程序中页面间传递值的两种方法(微信小程序传递值的方法)

本站:VPS参考评测推荐,专注分享VPS服务器优惠信息!若您是商家也可以在本站进行投稿,查看详情!此外我们还提供软文收录、PayPal代付、广告赞助等服务,查看详情!
部分文章发布时间较久远,可能存在未知因素,购买时建议在本站搜索商家名称,可查看相关文章充分了解商家!若非中文页面可使用谷歌浏览器同步翻译!PayPal代付/收录合作

本文简介了微信小程序中页面间值传递的两种方法。有一定的参考价值,有需要的朋友可以参考一下,希望对大家有所帮助。

一:url是带参数传递的

就像前端语言一样,小程序页面之间的传递可以通过给路由url附加参数来完成,参数会随着路由一起传递到新页面。

index.wxml:

lt!--index.wxml--> ltview class = 容器 gt lt!--使用导航组件-->: lt;导航器url = ../demo/demo?Title=参数传递" gtTitle=参数传递

//pages/demo/demo . jspage({ data:{ title: # 39;'}、onload:function(options){ console . log(options)//Print options,可以看到title的值可以获取到this . setdata({ title:options.title//assign值到页面中的标题})},}) demo.wxml

lt!--pages/demo/demo . wxml -- gt; lt查看class = # 39集装箱 # 39; gt{ { title } } lt/view gt;效果图:

其次,将值存储在全局变量中。

我们还可以将所需的值存储在全局变量中,并在需要的地方直接引用它们。

app.js

//app . jsapp({ global data:{ } })index . wxml

lt!--index.wxml--> lt!--点击触发goto_demo函数-->: lt;view class = 容器 bindtap = # 39goto _ demo # 39 gtTitle=参数传递

//index.js//获取应用实例constapp = getapp()page({ data:{ title: # 39;参数传递 # 39;},goto _ demo:function(){ app . global data . title = this . data . title wx . navigate to({ URL: # 39;../demo/demo # 39;,}) }})demo.js

// pages/demo/demo.js//获取应用实例constapp = getapp()page({ data:{ title: # 39;'}、onload:function(options){ console . log(app . global data . title)//print options,可以看到title的值可以得到this . setdata({ title:app.globaldata.title//assign一个值到页面中的标题}})。当需要使用全局变量时,记得先获取应用程序实例:const app = getApp()

效果图同上。

相关学习推荐:小程序开发教程以上是小程序中页面间传递值的两种方法的详细简介。请多关注本站其他相关文章!

本文由本站刊发,转载请注明:浅谈小程序中页面间传递值的两种方法(微信小程序传递值的方法) https://本站.com/78344.html

推荐站内搜索:国际域名、日本代理服务器ipcn域名备案、https代理ip、icp网站备案香港云主机、郑州服务器、代备案域名备案查询、网站备案教程、