解决slate编辑器在safari下的兼容问题及中文输入法光标问题-个人文章-SegmentFault思否
前言
用过 slate 编辑器的都知道它对于中文输入有以下兼容性问题：
在 chrome 浏览器下，输入中文是，编辑区的光标始终停在拼音的前面（不影响输入，但体验很糟） 在 safari 等支持 onbeforeinput 方法的浏览器下（HAS_INPUT_EVENTS_LEVEL_2）无法使用输入法输入中文GitBook 使用的也是 slate 编辑器，但它对 slate 底层做了很多修改，解决了这些问题。在我对比 gitbook/slate 与 slate 时，没有找到解决方案。
后来，我在 slate 的 issue 里查找该问题，找到了一些不错的回答。
环境：slate 0.47.1 slate-react 0.22.1
光标停留在拼音前的问题
参考 pull request 。找到相关源代码，修改即可。
按照上述代码修改之后，发现光标问题解决了，且 safari 浏览器下也有了一些小变化：输入法能正常工作了，但是最后的输入内容不会输入到 浏览器内。
safari 输入问题
参考 issue 。最后面用户 hudk114 的评论里有提到，需要在 onCompositionEnd 时，根据是否需要插入数据（HAS_INPUT_EVENTS_LEVEL_2 为真时），调用 edit.insertText 插入数据。
这样写就行：
const isSynthetic = !!event.nativeEvent
if (isSynthetic && HAS_INPUT_EVENTS_LEVEL_2){
editor.insertText(event.data);
}
修改了这两处之后，输入中文的问题即可解决。
- 上一篇：Pandas时序数据处理入门-阿里云栖社区-SegmentFault思否
- 下一篇：css3中的变形（transform）、过渡（transition）、动画（animation）属性讲解-个人文章-SegmentFault思否
相关文章
图文推荐
- 文章
- 推荐
- 热门新闻