Draft.js 的 RichUtils.toggleInlineStyle 不能正常工作。请帮忙!
我的代码在 JSfiddle 上。
有什么误解吗?
var TextArea = React.createClass({
...
toggleBlockStyle: function(blockType) {
this.onChange(RichUtils.toggleBlockType(this.state.editorState, blockType)); // don't work!
},
toggleInlineStyle: function(inlineStyle) {
this.onChange(RichUtils.toggleInlineStyle(this.state.editorState, inlineStyle)); // don't work!
},
handleClear: function() {
this.onChange(EditorState.push(this.state.editorState,
ContentState.createFromText(''), 'remove-range')); // don't work!
},
...
render: function() {
return (
<div onClick={this.onFocus}>
{this.renderButtons()}
<Editor editorState={this.state.editorState}
className={this.props.className}
name={this.props.name} ref="editor"
placeholder={this.props.placeholder}
handleKeyCommand={this.handleKeyCommand}
onChange={this.onChange}
spellCheck={true}
stripPastedStyles={true}
customStyleMap={myStyleMap}/>
</div>);
}
}
最佳答案
当您使用按钮切换样式时,它会导致编辑器失去焦点并且不会应用样式。使用 onClick
而不是 onMouseDown
,它会在编辑器失去焦点之前触发。
我在 github 线程 here 中找到了此修复程序。为方便起见引用:
//...
render() {
//...
return (
<span className={className} onMouseDown={this.onToggle}>
{this.props.label}
</span>
);
}
};
关于javascript - Draft.js 's RichUtils.toggleInlineStyle doesn' t 工作,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/37161497/