我使用 Dart WebUI 创建了一个包含另一个这样的组件的组件。
我对单击的期望响应是,当我单击内部组件时,它会在该内部组件内部触发并且不会影响包含它的组件。但是,内部组件上的单击事件会在内部组件和外部组件中触发。
有没有办法处理内部的点击并防止它“冒泡”到它的父元素?
<!DOCTYPE html>
<html>
<head>
<link rel="import" href="ColorItem.html">
</head>
<body>
<element name="color-item-with-inside-color-item" constructor="ColorItemWithInsideColorItem" extends="ColorItem">
<template>
<style scoped>
#inner-color-item div{
border:5px solid WhiteSmoke;
}
#inner-color-item {
margin-top:10px;
margin-bottom:0px;
}
</style>
<color-item color_text="{{color_text}}" bg_color="{{bg_color}}" text_color="{{text_color}}">
<color-item id="inner-color-item" style></color-item> <!-- THIS IS THE INNER ITEM -->
</color-item>
</template>
<script type="application/dart" src="ColorItemWithInsideColorItem.dart"></script>
</element>
</body>
</html>