Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

支持直接传入元素进行初始化 #231

Closed
NateScarlet opened this issue Mar 23, 2020 · 4 comments
Closed

支持直接传入元素进行初始化 #231

NateScarlet opened this issue Mar 23, 2020 · 4 comments
Assignees
@NateScarlet
Labels
引入特性
Milestone
3.0.0

Comments

@NateScarlet
Copy link
Contributor

你在什么场景下需要该功能？

现在初始化需要元素id， 然后所有操作都基于 document.getElementById(vditor.id)

但是元素的ID值是可写的, 还有ID重复的可能

应该在初始化时直接保存Element引用，这样就可以避免对ID的依赖。

描述可能的解决方案

  1. new Vditor 的首个参数改为 string | HTMLDivElement
    传入 string 时匹配当前行为，传入 Element 时直接使用。
    内部使用初始化时获取到的 element 而不是使用 document.getElementById

  2. options 的 cache 参数改为 boolean | string 来指定 localStorage 的 key。
    为 true 时要求 id 为 string，匹配当前行为。

其他信息

我作为 Vue 组件用，并且不使用缓存想避免 id 作为必填属性。

所以都是每次初始化生成一个ID 初始化完了再去掉， 并从工具栏里面移除所有使用了 document.getElementById 的功能
@Vanessa219
Copy link
Owner

使用了 ID 会有什么影响么？

@NateScarlet
Copy link
Contributor Author

NateScarlet commented Mar 24, 2020 •
edited

API设计应遵循最少知识原则 ID作为必填参数我看好像只是实现了可选的缓存功能

有什么影响我上面不都说了

  • 组件设计的时候不能假设一个页面只会有一个编辑器 必填参数越多的组件越难用
    我现在用随机ID作为默认值 这又是额外的逻辑 可以避免尽量还是避免
  • 导致命名困难症发作
  • 同一个ID随时间经过可能指向不同的元素

ID要是没啥其它我不知道的用处我可以PR

@NateScarlet NateScarlet reopened this Mar 24, 2020
@NateScarlet
Copy link
Contributor Author

我现在实际用例是
基于Vditor实现了MarkdownEditor.vue (绑定文本)
然后基于这个又实现了 CommentEditor.vue (绑定文本加提及信息)
缓存要存也是在CommentEditor存 用不上Vditor自带的缓存实现 但是ID得一路往下传到Vditor 或者我在MarkdownEditor随机生成

@Vanessa219
Copy link
Owner

Vanessa219 commented Mar 25, 2020 •
edited

你有空的话就提 PR 吧，现在忙着弄 ir 模式中的 toolbar。

PS： 如果有传入 id， cache 还是用 id 标识，这样就应该可以兼容以前的用户了。

@NateScarlet NateScarlet mentioned this issue Mar 25, 2020
Merged
@Vanessa219 Vanessa219 added this to the 3.0.0 milestone Mar 25, 2020
Vanessa219 added a commit that referenced this issue Mar 25, 2020
@Vanessa219
🎨 fix #231
71e69af
Vanessa219 added a commit that referenced this issue Mar 25, 2020
@Vanessa219
🐛 #231
ff6d813
stevapple pushed a commit to stevapple/vditor that referenced this issue Apr 8, 2020
@NateScarlet @stevapple
feat: allow init with element
bd1f77e 
Resolve Vanessa219#231
stevapple pushed a commit to stevapple/vditor that referenced this issue Apr 8, 2020
@Vanessa219 @stevapple
🎨 fix Vanessa219#231
f3461e3
stevapple pushed a commit to stevapple/vditor that referenced this issue Apr 8, 2020
@Vanessa219 @stevapple
🐛 Vanessa219#231
5c6bddf
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment
Assignees

@NateScarlet NateScarlet

Labels
引入特性
Projects
None yet
Milestone
3.0.0
Development

No branches or pull requests
2 participants
@Vanessa219 @NateScarlet