有学有练才叫学习:学而不思则罔,思而不学则殆:学而不习,纸上谈兵,习而不进,画地为牢!

原生微信小程序事件传参接参方法

小程序 cat 6个月前 (03-23) 80次浏览 已收录 0个评论 扫描二维码

1.声明式导航传参

navigator 组件的 url 属性用来指定将要跳转到的页面的路径。同时,路径的后面还可以携带参数:
参数与路径之间使用 ? 分隔
参数键与参数值用 = 相连
不同参数用 & 分隔

代码示例如下:

<navigator url="/pages/info/info?name=zs&age=20">跳转到info页面</navigator>

2.编程式导航传参

调用 wx.navigateTo(Object object) 方法跳转页面时,也可以携带参数,代码示例如下:

<button bindtap="gotoInfo2">跳转到info页面</button>
//通过编程式导航,跳转到info页面,并携带参数
gotoInfo2() {
    wx.navigateTo({
        url:'/pages/info/info?name=1s&gender=男'
    })
}

onLoad 中接收导航参数

通过声明式导航传参或编程式导航传参所携带的参数,可以直接在 onLoad 事件中直接获取到,示例代码如下

/**
 * 生命周期函数--监听页面加载
 */
onLoad(options) {
    // options就是导航参数传过来的对象
    console.log(options)
},

事件分类:

冒泡事件/公有事件:当一个组件上的事件被触发后,该事件会向父节点传递。
非冒泡事件/私有事件:当一个组件上的事件被触发后,该事件不会向父节点传递。

bind和catch区别:

bind 允许冒泡
catch 阻止冒泡

currentTarget和target区别

target 获取的是事件源上绑定组件的参数
currentTarget 当前事件绑定组件的参数

 

喜欢 (0)
cat
关于作者:
发表我的评论
取消评论
表情 贴图 加粗 删除线 居中 斜体 签到

Hi,您需要填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址