没有JSX的React.js - "警告：有东西直接调用React组件。使用工厂或JSX代替“ [英] React.js without JSX - "Warning: Something is calling a React component directly. Use a factory or JSX instead"

问题描述

我正在尝试使用没有JSX的React.js组件并收到此类警告：

I'm trying to use React.js component without JSX and receive such warning:

警告：有些东西直接调用React组件。请改用工厂或JSX。请参阅：http：//fb.me/react-legacyfactory


我已访问过链接，但建议 createFactory 解决方案没有帮助我：/

I've visited link but suggested createFactory solution didn't help me :/

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

我无法弄清楚这里有什么问题？

I cannot figure out what is the problem here?

推荐答案

React.createClass（s​​pec）返回组件。

React.createElement（component，props，... children）创建元素。

React.createFactory（component）返回 factory 函数，该函数可用于创建元素。

React.createFactory(component) returns a factory function, which can be used to create an element.

React.createFactory（a）（b，c，d）与 React.createElement（a，b，c，d）。

当你打电话给<时，你会收到警告strong>组件直接，例如 component（）。如果你想像函数一样调用它，请使用createFactory

You get the warning when you call a component directly, like component(). If you want to call it like a function, use createFactory

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

或者使用createElement：

Or use createElement:

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

在0.13中，这将给出错误而不是警告：

In 0.13 this will give an error instead of a warning:

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

另外因为React.DOM消失了，你应该创建dom 元素与创建组件基于元素的方式相同

Also because React.DOM is going away, you should create dom elements the same way you create component based elements

^{编辑：看起来像React.DOM一直在四处走动现在。}

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

// or

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

_{粗体用于显示一致的条款。 ... children 表示任意数量的子参数}

_{Bold used to show consistent terms. ...children means any number of child arguments}

这篇关于没有JSX的React.js - &quot;警告：有东西直接调用React组件。使用工厂或JSX代替“的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！