braft-extensions
braft-extensions copied to clipboard
mention扩展按Enter键不能触发选中,只能用tab和鼠标触发
mention扩展按Enter键不能触发选中,只能用tab和鼠标触发,draftjs官方插件的示例中不影响: https://www.draft-js-plugins.com/plugin/mention
已解决,原因是当前项目中定义的handleReturn未生效: 将 文件 https://github.com/margox/braft-extensions/blob/master/src/mention/index.jsx#L88 起,由以下代码
return {
...editorProps,
draftProps: {
...editorProps.draftProps,
...draftEditorPlugin.getAccessibilityProps(),
...passSomeKeyEventToKeyBindingFn(editorProps.draftProps || {})
},
keyBindingFn: (event) => {
// 先处理前面插件的 keyBindingFn
// 暂时没有发现 mention 必须优先处理的必要性
const originHandler = editorProps.keyBindingFn
let ret = null
if (typeof originHandler === 'function') {
ret = originHandler(event)
}
return ret != null ? ret : draftEditorPlugin.keyBindingFn(event, getAndSetState)
},
handleReturn: (event, editorState, editor) => {
const originHandler = editorProps.handleReturn
// 这里 mention 要优于其他的插件处理 回车 事件
// 因为在 mention 弹出 suggestion 时 有「确认选择」的功能
if (draftEditorPlugin.handleReturn(event, editorState, getAndSetState) === 'handled') {
return 'handled'
}
return originHandler ? originHandler(event, editorState, editor) : 'not-handled'
}
}
修改为:
return {
...editorProps,
draftProps: {
...editorProps.draftProps,
...draftEditorPlugin.getAccessibilityProps(),
...passSomeKeyEventToKeyBindingFn(editorProps.draftProps || {}),
handleReturn: (event, editorState, editor) => {
const originHandler = editorProps.handleReturn
// 这里 mention 要优于其他的插件处理 回车 事件
// 因为在 mention 弹出 suggestion 时 有「确认选择」的功能
if (draftEditorPlugin.handleReturn(event, editorState, getAndSetState) === 'handled') {
return 'handled'
}
return originHandler ? originHandler(event, editorState, editor) : 'not-handled'
}
},
keyBindingFn: (event) => {
// 先处理前面插件的 keyBindingFn
// 暂时没有发现 mention 必须优先处理的必要性
const originHandler = editorProps.keyBindingFn
let ret = null
if (typeof originHandler === 'function') {
ret = originHandler(event)
}
return ret != null ? ret : draftEditorPlugin.keyBindingFn(event, getAndSetState)
},
}