临邑企业网站建设-小程序如何实现传参

--------

临邑企业网站建设

-------

工作中至今,触碰过avalon,vue,手机微信小程序, ReactNative等多种前端开发技术性, 到最终发现, 都少不了传参, 接下来看看手机微信小程序怎样完成传参做下简易总结


工作中至今,触碰过avalon,vue,手机微信小程序, ReactNative等多种前端开发技术性, 到最终发现, 都少不了传参, 接下来看看手机微信小程序怎样完成传参做下简易总结=.=


手机微信小程序之传参的几种方式

大家先来看一张图, 这里边总结了几种方式: 

 接下来, 我就这张图做简易表明, 早已搞清楚的大佬们能够立即绕过, 也还请多多指教~

1. navigator组件完成网页页面跳转时可携带主要参数

 // 假定在js文档的data数据信息中有声明userCode自变量
 点我跳转到home
拷贝编码

2. navigateTo()方式完成网页页面跳转时可携带主要参数

 let userCode = "test";
 wx.navigateTo({
 url: `../home/home?userCode=${userCode}`
拷贝编码

 以上两种方式完成实际效果是一样的: 携带主要参数并跳转到home网页页面, 那末在home网页页面该怎样接受传送过来的主要参数呢?
Answer: 在onLoad()方式里立即获得便可!

 onLoad: function (options) {
 console.log("瞧一瞧你拿到的值",options); 
拷贝编码

3. 恶性事件传参
小程序能够在组件上关联恶性事件, 在传送主要参数的情况下, 根据自定特性的方法, 详尽能够看下面的事例!

 //wxml
 恶性事件传参
 // js
 tapFn(e){
 console.log("获得到自定主要参数目标结合:", e.currentTarget.dataset);
拷贝编码

若将wxml中的bindtap改变成是catchtap, 一样能够根据同样的js获得到主要参数结合!

4. 组件传参

 // 假定有个test自定组件 Ti凡科抠图: widget为自定特性名字, 可随便变更~
 // test组件界定处
 properties: {
 widget: {
 type: Object,
 value: {}
 //组件应用处
拷贝编码

这样, 大家便可以根据widget自定特性将值传给子组件, 供子组件开展网页页面3D渲染.


作者:一枚前端开发搬砖仔
连接:post/

经典著作权归作者全部。商业服务转载请联络作者得到受权,非商业服务转载请注明出处。 ---------

临邑企业网站建设

------------

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://pixelkt.cn/ganhuo/4086.html