背景
折叠面板Collapse标题中增加复选框，点击复选框，会触发折叠面板的展开和折叠。
我们希望勾选复选框的时候，不能影响到折叠面板的展开和折叠。
最开始使用onChange自带的event来阻止事件冒泡，这种方式是无效的，代码如下：
<Checkbox
style={{ marginRight: 5 }}
onChange={(e) => {
console.log('e:', e); // 虽然这里的event也具有stopPropagation方法
e.stopPropagation(); // 这种方式是无效的
handleClickItemCheckbox(isChecked, item.task_record_id);
}}
checked={isChecked}
/>
解决
监听复选框的onClick事件，用e.stopPropagation()阻止事件冒泡。文章来源：https://www.toymoban.com/news/detail-514137.html
<Checkbox
style={{ marginRight: 5 }}
onChange={handleClickItemCheckbox(isChecked, item.task_record_id)}
checked={isChecked}
onClick={(e) => e.stopPropagation()} // 在这里
/>
文章来源地址https://www.toymoban.com/news/detail-514137.html
到了这里，关于react antd阻止Checkbox事件冒泡（折叠面板标题中增加复选框，阻止点击复选框折叠面板展开/折叠）的文章就介绍完了。如果您还想了解更多内容，请在右上角搜索TOY模板网以前的文章或继续浏览下面的相关文章，希望大家以后多多支持TOY模板网！
