mirror of
https://github.com/willmiao/ComfyUI-Lora-Manager.git
synced 2026-03-21 21:22:11 -03:00
9032226724
Remove multiple sources of truth and async sync chains that caused values to be lost during load/switch workflow or reload page. Changes: - Remove internalValue state variable from main.ts - Update getValue/setValue to read/write DOM directly via widget.inputEl - Remove textValue reactive ref and v-model from Vue component - Remove serializeValue, onSetValue, and watch callbacks - Register textarea reference on mount, clean up on unmount - Simplify AutocompleteTextWidgetInterface Follows ComfyUI built-in addMultilineWidget pattern: - Single source of truth (DOM element value only) - Direct sync (no intermediate variables or async chains) Also adds documentation: - docs/dom-widgets/value-persistence-best-practices.md - docs/dom-widgets/README.md - Update docs/dom_widget_dev_guide.md with reference
29 lines
1.0 KiB
Markdown
29 lines
1.0 KiB
Markdown
# DOM Widgets Documentation
|
|
|
|
Documentation for custom DOM widget development in ComfyUI LoRA Manager.
|
|
|
|
## Files
|
|
|
|
- **[Value Persistence Best Practices](value-persistence-best-practices.md)** - Essential guide for implementing text input DOM widgets that persist values correctly
|
|
|
|
## Key Lessons
|
|
|
|
### Common Anti-Patterns
|
|
|
|
❌ **Don't**: Create internal state variables
|
|
❌ **Don't**: Use v-model for text inputs
|
|
❌ **Don't**: Add serializeValue, onSetValue callbacks
|
|
❌ **Don't**: Watch props.widget.value
|
|
|
|
### Best Practices
|
|
|
|
✅ **Do**: Use DOM element as single source of truth
|
|
✅ **Do**: Store DOM reference on widget.inputEl
|
|
✅ **Do**: Direct getValue/setValue to DOM
|
|
✅ **Do**: Clean up reference on unmount
|
|
|
|
## Related Documentation
|
|
|
|
- [DOM Widget Development Guide](../dom_widget_dev_guide.md) - Comprehensive guide for building DOM widgets
|
|
- [ComfyUI Built-in Example](../../../../code/ComfyUI_frontend/src/renderer/extensions/vueNodes/widgets/composables/useStringWidget.ts) - Reference implementation
|