使用命令模式实现 undo、redo 功能

Last Updated: July 28, 2022 · 2 min read

场景

最近在实现互动白板 undoredo 功能时候了解到了命令模式,直接上代码,其实并不复杂

ts

可以看到 UndoRedoManager 主要就是维护了执行栈和未执行栈,然后每次 undoredo 时候入栈出栈执行对应 cmd 的 executeunexecute 方法

demo 演示

jsx

总结

所谓命令模式实现的 undoredo 功能其实就是当你想执行一个动作时候,同时提供该命令的反向操作,以上边 demo 为例,当你想把方块从 (0, 0) 移动到 (100, 100) 时候,需同时提供一个反向命令把它从 (100, 100) 移动到 (0, 0),命令是在 manager 中帮你执行,可以做到代码抽象分离,避免业务代码中掺合过多控制流程


©2022xiaojun1994
 0   0