React.js без JSX - «Предупреждение: Что-то звонит РЕАКТ компонент непосредственно использовать фабрику или JSX вместо этого.»

Question

Я пытаюсь использовать компонент React.js без JSX и получить такое предупреждение:

Warning: Something is calling a React component directly. Use a factory or JSX instead. See: http://fb.me/react-legacyfactory

Я посетил ссылку, но предложил createFactory решение не помогло мне:/

app.js

var React = require('react/addons'); 
var TagsInput = React.createFactory(require('./tagsinput')); // no luck 

var TagsComponent = React.createClass({ 
    displayName: "TagsComponent", 
    saveTags: function() { 
    console.log('tags: ', this.refs.tags.getTags().join(', ')); 
    }, 

    render: function() { 
    return (
     React.createElement("div", null, 
     React.createElement(TagsInput, {ref: "tags", tags: ["tag1", "tag2"]}), 
     React.createElement("button", {onClick: this.saveTags}, "Save") 
    ) 
    ); 
    } 
}); 

React.render(React.createElement(TagsComponent, null), document.getElementById('tags')); 

tagsinput.js

https://raw.githubusercontent.com/olahol/react-tagsinput/master/react-tagsinput.js

Я не могу понять, что здесь проблема?

Answer 1

React.createClass(spec) возвращает компонент.

React.createElement(component, props, ...children) создает элемент .

React.createFactory(component) возвращает завод функцию, которая может быть использована для создания элемента.

React.createFactory(a)(b, c, d) такое же, как React.createElement(a, b, c, d).

Вы получаете предупреждение, когда вы вызываете компонент напрямую, например component(). Если вы хотите назвать это как функция, используйте createFactory

var factory = React.createFactory(component); 
var element = factory(props, ...children); 

Или используйте createElement:

var element = React.createElement(component, props, ...children); 

В 0.13 это даст ошибку вместо предупреждения:

var element = component(props, ...children); 

Также потому что React.DOM уходит, вы должны создать dom элементов так же, как вы создаете Компонент основанные на Элементы

^{Редактировать: выглядит как React.DOM.}

var div = React.createFactory('div'); 
var element = div(props, ...children); 

// or 

var element = React.createElement('div', props, ...children); 

_{Жирный используется, чтобы показать последовательные сроки....children означает любое количество дочерних аргументов}

Answer 2

Вам нужно обернуть все из дочерних компонентов в createFactory, а я был в состоянии получить свой код, чтобы работать без этого конкретного предупреждения, обернув Tag и Input в createFactory.

jsbin