53 lines
1.3 KiB
Markdown
53 lines
1.3 KiB
Markdown
# Task 关闭按钮修复计划
|
|
|
|
## 问题分析
|
|
|
|
根据代码审查，`g3-task-close` 点击无反应的核心问题在于：
|
|
|
|
1. **事件绑定方式错误**：使用直接绑定而非事件委托
|
|
2. **taskId 未绑定到 DOM**：无法通过 DOM 获取当前任务 ID
|
|
3. **closeTask 方法不完善**：只删除数据，未删除对应的 DOM 元素
|
|
|
|
## 修复方案
|
|
|
|
### 1. 修改 renderTaskCenter 方法
|
|
|
|
* 在 DOM 元素上添加 `data-task-id` 属性
|
|
|
|
* 移除直接的事件绑定
|
|
|
|
### 2. 修改 closeTask 方法
|
|
|
|
* 同时删除数据和对应的 DOM 元素
|
|
|
|
### 3. 添加事件委托（在初始化时绑定）
|
|
|
|
* 使用事件委托绑定 `.g3-task-close` 点击事件
|
|
|
|
### 4. 检查 pointer-events 样式
|
|
|
|
* 确保 `.g3-task-close` 按钮可点击
|
|
|
|
## 修改文件
|
|
|
|
* `d:\workspace\code\file-preview\g3-file\index.js`
|
|
|
|
## 修改步骤
|
|
|
|
1. 在 `renderTaskCenter` 的 HTML 模板中添加 `data-task-id`
|
|
2. 移除 `renderTaskCenter` 中的直接事件绑定
|
|
3. 修改 `closeTask` 方法，添加 DOM 删除逻辑
|
|
4. 在初始化时添加事件委托绑定
|
|
|
|
## 风险评估
|
|
|
|
* 低风险：修改局部代码，不影响其他功能
|
|
|
|
* 需确保事件委托只绑定一次
|
|
|
|
## 验证方式
|
|
|
|
1. 点击关闭按钮，检查控制台是否输出正确的 taskId
|
|
2. 确认任务数据和 UI 都被正确移除
|
|
|