Что такое реакция-пусто: *?

Ответ 1

На самом деле это часть Реагировать внутреннюю поддержку таких вещей, как null:

// A perfectly valid component
() => null

// Also a perfectly valid component
const MyComponent = React.createClass({
  render() {
    if (this.props.hidden) return null;
    return <p>My component implementation</p>;
  }
});

Ответ 2

Посмотрите на эту часть кода React, который создает это:

var nodeValue = ' react-empty: ' + this._domID + ' ';
    if (transaction.useCreateElement) {
      var ownerDocument = hostContainerInfo._ownerDocument;
      var node = ownerDocument.createComment(nodeValue);
      ReactDOMComponentTree.precacheNode(this, node);
      return DOMLazyTree(node);
    } else {
      if (transaction.renderToStaticMarkup) {
        // Normally we'd insert a comment node, but since this is a situation
        // where React won't take over (static pages), we can simply return
        // nothing.
        return '';
      }
      return '<!--' + nodeValue + '-->';
    }
  },

Итак, в основном, если ваш компонент возвращает null, он создаст комментарий, который показывает этот элемент пустым, но React позаботится об этом для вас, купив комментарий там <!-- react-empty: 3 --> все фреймворки JavaScript попытаются использовать комментарий в DOM, чтобы показать, что они обрабатывают код, аналогичным является ng-if в angular, например...

Ответ 3

Обратите внимание, что с помощью React >= 16 вы больше не увидите <!-- react-empty: X -->