在读Touch事件官方文档的时候,遇到了一个属性
其他属性都好理解,这个阻塞事件冒泡什么意思呢?官网也没有解释
后来查资料知道这个方法是阻止onTouch冒泡传递到父组件。
show code
@Entry
@Component
struct OfficialTouchPage {@State message: string = ' touch me touch me'static idNumber = 0build() {Row() {Column() {Stack(){Text(this.message).fontSize(50).fontWeight(FontWeight.Bold).onTouch((touch: TouchEvent) => {this.message = 'touch type' + touch.type+'\n timestamp' +touch.timestamp+'\n source' +touch.source})Text('这是最上边的').fontSize(30).width(200).height(200).backgroundColor(Color.Brown).fontWeight(FontWeight.Bold).onTouch((touch: TouchEvent) => {//这里不调用子组件的touch.stopPropagation// touch.stopPropagation()})}.onTouch((touch: TouchEvent) => {OfficialTouchPage.idNumber++this.message = '点击了父组件'+OfficialTouchPage.idNumber})}.width('100%')}.height('100%')}
}
如上代码 ,我在statck组件添加了touch事件,并且在子组件Text('这是最上边的')也添加了touch事件,并且touch中不调用touch.stopPropagation()。这样我在点击这个Text的时候,子组件与父组件的touch事件都会响应,也就是我可以成功修改this.message.
如果打开touch.stopPropagation(),那么我在点击Text的时候,就不会触发父组件Stack的touch事件。
另外,官网的这个解释(阻塞事件冒泡)真的让人有点摸不到头脑,汉语真有意思~~