0

I had tried a few times to implement draftjs in the past. However, after some time I tried it again today with the ^0.10.* version.

But with the basic example, I am getting a constant error:

Uncaught TypeError: blockRendererFn is not a function
at DraftEditorContents.render (index_bundle.js:113154)
at finishClassComponent (index_bundle.js:63203)
at updateClassComponent (index_bundle.js:63180)
at beginWork (index_bundle.js:63555)
at performUnitOfWork (index_bundle.js:65554)
at workLoop (index_bundle.js:65618)
at HTMLUnknownElement.callCallback (index_bundle.js:55872)
at Object.invokeGuardedCallbackDev (index_bundle.js:55911)
at invokeGuardedCallback (index_bundle.js:55768)
at renderRoot (index_bundle.js:65696

I think the blockrendererFn is compulsory now. However, I am still not able to figure out what exactly might be the problem.

I am following the basic tutorial to create an editor using EditorState.createEmpty()

Any help would be appreciated. Here is my class:

import React from 'react';
import {Editor,
        EditorState,
        DefaultDraftBlockRenderMap
        } from 'draft-js';

import {Segment} from 'semantic-ui-react';

class MyTodoListEditor extends React.Component {
constructor(props) {
    super(props);

    this.state = {
        editorState: EditorState.createEmpty(),
    };

    this.onChange = (editorState) => this.setState({editorState});

}

render () {
    return (
        <Segment>
        <Editor
            editorState={this.state.editorState}
            onChange={this.onChange}/>
        </Segment>
    );
}
}

Editor.propTypes = {};
Editor.defaultProps = {};

export default MyTodoListEditor;
Omkar
  • 2,274
  • 6
  • 21
  • 34
  • You should include some code -- it's impossible for anyone to help diagnose an error message without seeing your code. – arthurakay Feb 04 '18 at 20:12
  • @arthurakay just edited and sorry about the incomplete info. – Omkar Feb 04 '18 at 20:15
  • I haven't done a thorough search but it may be possible that ```Segment``` component is modifying props before they flow down to ```Editor```? Could you try running code with ```Editor``` component not wrapped in ```Segment``` component? – Varinder Feb 04 '18 at 20:31
  • @Varinder I had tried that in the past, but to no avail. Even after adding a custom function to blockRendererFn, I still get an error: `TypeError: Cannot read property 'get' of undefined` – Omkar Feb 04 '18 at 20:35

0 Answers0