2015-01-26 4 views
0

Я пытаюсь сделать очень простую таблицу с среагировать, но он горько жалуется:Простая реакция компонентов компонента не действительна - причина?

«Инвариантные Нарушение: Table.render():. Действительное ReactComponent должны быть возвращены Вам, возможно, вернулся неопределенными, массив или другой недопустимый объект. "

Вот определение:

var Table = React.createClass({ 

    render: function() { 
    return 
    (<table class="table table-striped"> 
     <thead> 
     <tr> 
      <th>Header 1</th> 
      <th>Header 2</th> 
     </tr> 
     </thead> 
     <tbody> 
     <tr> 
      <td>One</td> 
      <td>Two</td> 
     </tr> 
     <tr> 
      <td>One</td> 
      <td>Two</td> 
     </tr> 
     </tbody> 
    </table>); 
    } 
}); 

Это единственный элемент вернулся, HTML является действительным, поэтому я не уверен, что проблема есть. Кто-нибудь знает, в чем проблема?

+0

Не могли бы вы предоставить больше кода? Здесь нет ничего плохого, кроме 'class' (это должно быть' className'). Мое предложение - взглянуть на сгенерированный код (если используется процесс транспиляции, а не инструмент JSX браузера). Эта ошибка возникает, когда: https://github.com/facebook/react/blob/54c82da15f6b4717425edbf68e23ae82583a50af/src/core/__tests__/ReactEmptyComponent-test.js#L71-L82 –

+0

Не знаете, какой еще код предоставить. Компонент действительно то, что вы видите. Переход к className ничего не изменил. – flq

+0

yep, ошибка в свойстве не вызвала бы эту ошибку. Вы взглянули на сгенерированный код? –

ответ

1

Hat-tip to evan, который фактически предоставил ответ в комментариях.

Я просто сработал «авто» - вставка точек с запятой Javascript. Единый оператор возврата, предназначенный для возврата из функции, дающий ему возвращаемое значение undefined. следующий jsx никогда не был выполнен.

Запуск jsx в той же строке, что и возврат, гарантирует, что возврат выполнен в соответствии с назначением.

0

Это проблема компиляции babel. Поместите html-код в собственные строки.
возврата ( Заголовок 1 Заголовок 2 Один Два Один Два );

И класс изменение Classname

0

Возвращение из метода визуализации необходимо гнездовой все под одной <div> тега.

+0

нет, это не обязательно, любой компонент реагирования будет выполнять роль root. – flq

Смежные вопросы