2015-03-26 4 views
0

У меня возникли некоторые серьезные проблемы в получении срабатывает настройки с рендерингом на стороне сервера .. Вот мои соответствующие файлы на меня проблему: https://bitbucket.org/snippets/imattacus/g9r6Isomorphic React, неспособный отображать как строку, потому что у меня нет действительного элемента реакции?

Я руководства в Интернете, и я я просто делаю то, что вижу другие люди, но у меня такое впечатление, что я отреагировал на компонент (класс?), и мне нужно отреагировать .createElement() на компонент, который я сделал, чтобы его можно было визуализировать.

Но я не понимаю, как это сделать, потому что createElement требует положения в DOM?

Я только новичок, чтобы реагировать, поэтому я, возможно, совершенно неправильно понял что-то на этом пути, но можете ли вы, ребята, увидеть какие-либо проблемы в моем коде, что приведет к «инвариантной ошибке», неспособной использовать renderToString для недействительного ReactElement?

Спасибо!

ответ

2

Я считаю, что это потому, что вы пытаетесь отобразить всю html-страницу, включая теги html, которые я не думаю (не 100% на этом).

Вот несколько фрагментов кода, который я использую для обработки рендеринга сервера. (Я использую Коа) код сервера

this.body = yield RENDER("index", { TEMPLATE: React.renderToString(<IndexView/>) }); 

Стандартный HTML страницы

<html> 
<head>...</head> 
    <body> 
      <div id="app-root">{{ TEMPLATE|safe }}</div> 
    </body> 
    </html> 

И это на стороне клиента Фрагмент кода JavaScript

React.render(<IndexView/>, document.getElementById('app-root')); 

Короче говоря, не включают в себя HTML/head в JSX. Имейте layout.html или sorthing сортировки и смонтируйте компонент React либо на документе.body, либо на элементе с заданным идентификатором