小程序框架wepy,在子组件中emit事件,在父组件中无法接收到?

小程序框架wepy,在子组件中emit事件,在父组件中无法接收到?,第1张

排查了好久都没有头绪。

最后只能通过对比。

同时打印该组件的this,和,能成功触发父组件的子组件,中的this。

发现了问题所在。

前者的$isComponent值是此悉仿false,而后者是true。

我就纳闷了,明明组件是注册并且成功森纤使用的,怎么会提示不是组件呢?

难道是因为我那个子组件文件没有放到components目录导致的?

移动之后,依然未触发。

在焦灼摸索了个把钟后,终于发现了问题所在。

原来陆尘,无法成功触发父组件的子组件中,继承的是wepy.page

应该继承wepy.component才对

问题解决!!

js负责页面与用户的交互,动态修改页面的内容。使用js脚本来处理用户的 *** 作。

*** 作解释: 点击button按钮(点我),修改界面的msg显示为"BeiJing佩奇"

绑定事件: bindtap定义了"点击事件"

j s 函数: Page({定义函数对应bindtap})

例如开头示例一样,组件绑定事件,js编写事件函数。

这里大概介绍下log打印的内容

☞ 小生不才,附上 博客地址☜

事件分为冒泡事件和非冒泡事件

1.冒泡事件尺带:当一个组件被触发后,该事件以此向父节点传递。

2.非冒泡事件:当一个组件触发后雹困逗,该事件不会向父节点传递。

解释:当点击子节点时,源卖会依次触发"bind事件2,bind事件1"

解释:当点击子节点时,只触发"bind事件2",而没有触发"bind事件1"

自基础班1.5.0起,触摸类事件支持捕获阶段。捕获阶段位于冒泡阶段之前。事件到达节点的顺序与冒泡相反。捕获事件采用的关键字为capture-bind、capture-catch,当然catch还是中断,取消冒泡阶段。

1. 示例1,执行顺序为hand2,hand4,hand3,hand1

2. 示例2,加入capture-catch捕获事件,只执行hand2

在组件中绑定一个事件处理函数。

如bindtap,当用户点击该组件的时候会在该页面对应的Page中找到相应的事件处理函数

<view bindtap="view"><text bindtap="toast" class="journey">开启小程序之旅 </text><埋森/view>

子元素触发父级元素也会触发若要只触发子元素使用catchtap代替bindtap

在相应的Page定义中写上相应的事件处理函数,参数是event。

Page({ toast: function (event) { // wx.navigateTo({ // url: '../redirect/redirect' // })wx.redirectTo({ url: '../redirect/redirect', })// view:function(event){ // // 父级元素 // } }, /** * 生命周期函数--监听页面隐藏/并未关银核闭返回 */ onHide: function (event) { console.log(event) }, /** * 生命周期函数--监听页面卸载/ */ onUnload: function () { console.log(222) }, })

事件分类

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

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

WXML的冒泡事件列表:

类型 触发条件 touchstart 手指触摸动作开始 touchmove 手指触摸后移动 touchcancel 手指触摸动作被打断,如来电提醒,d窗 touchend 手指触摸动作结束 tap 手指触摸后锋液掘马上离开 longtap 手指触摸后,超过350ms再离开

注:除上表之外的其他组件自定义事件如无特殊申明都是非冒泡事件,如<form/>的submit事件,<input/>的input事件,<scroll-view/>的scroll事件,(详见各个组件官方文档)


欢迎分享,转载请注明来源:内存溢出

原文地址: http://outofmemory.cn/yw/12555836.html

(0)
打赏 微信扫一扫 微信扫一扫 支付宝扫一扫 支付宝扫一扫
上一篇 2023-05-26
下一篇 2023-05-26

发表评论

登录后才能评论

评论列表(0条)

保存