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/

10-09 16:54