我怎样才能使编辑器的输入在新的一行输入时自动向下滚动?就像在www.example.com的例子6中https://jpuri.github.io/react-draft-wysiwyg/#/demo。现在滚动条停留在顶部,文本光标在底部边框以下时隐藏。
zengzsys1#
我现在也在纠结这个问题。这就是我现在的成就
const scrollDiv = document.querySelector('.my_editor_class') scrollDiv.scrollTop = scrollDiv.scrollHeight
这样你就可以在输入新行时使滚动条跟随文本光标。但请记住,如果文本光标不在编辑器的最后一个可见区域,并点击Enter按钮,滚动条将滚动到最后...非常糟糕的用户体验。你可以做的是创建一个算法来根据文本光标聚焦的位置调整位置。至少我是这么想的等待建议:)另见此github issue
6rvt4ljy2#
只需将动态导入移动到所有组件之外。
a14dhokn3#
div.DraftEditor-root { border: 1px solid #C0C0C0; height: 200px; width: auto; overflow-y: auto; } div.DraftEditor-editorContainer, div.public-DraftEditor-content { height: 100%; }
你可以在这里找到详细的答案https://dev.to/tumee/how-to-style-draft-js-editor-3da2
3条答案
按热度按时间zengzsys1#
我现在也在纠结这个问题。这就是我现在的成就
这样你就可以在输入新行时使滚动条跟随文本光标。但请记住,如果文本光标不在编辑器的最后一个可见区域,并点击Enter按钮,滚动条将滚动到最后...非常糟糕的用户体验。
你可以做的是创建一个算法来根据文本光标聚焦的位置调整位置。至少我是这么想的等待建议:)
另见此github issue
6rvt4ljy2#
只需将动态导入移动到所有组件之外。
a14dhokn3#
你可以在这里找到详细的答案https://dev.to/tumee/how-to-style-draft-js-editor-3da2