Bordo Messi Bordo Messi - 2 months ago 13
React JSX Question

How to create element of a 3rd party component in React using ES5 syntax?

I am using React version 15.1.0. I want to use medium-draft editor from https://github.com/brijeshb42/medium-draft. I am trying to create an element but I get an error.

var React = require('react')
var MediumDraftEditor = require('medium-draft');

var EmailTemplateContent = React.createClass({
render: function() {
return <MediumDraftEditor/>;

},


});

And, in some component I am calling this component
<EmailTemplateContent/>


I am getting following errors

Warning: React.createElement: type should not be null, undefined, boolean, or number. It should be a string (for DOM elements) or a ReactClass (for composite components). Check the render method of `EmailTemplateContent`.
http://127.0.0.1:8000/static/bundles/main-0a3cbca2a704a676c74d.js
Line 1127

Error: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object. Check the render method of `EmailTemplateContent`.

Answer

The docs are written in ES2015 syntax. The docs show to grab components from the 'medium-draft' package like this:

import {
  Editor,
  createEditorState,
} from 'medium-draft';

The ES5 equivalent will look like this:

var Editor = require('medium-draft').Editor;
var createEditorState = require('medium-draft').Editor;
Comments