Question

我从Rails和React开发测试项目。

我有来自react的root组件：

# chat_app.js.jsx.coffee
###* @jsx React.DOM ###
@ChatApp = React.createClass

displayName: 'chatApp'

render: ->

    return (
        `<div className="chatApp">
            <h1>React Chat App Example</h1>
            <div class="row">
                <div><MessageList /></div>
            </div>
        </div>`
        )

React.renderComponent(
  window.ChatApp(null),
  document.getElementById('chatApp')
)

我还有另一个组件：

# message_list.js.jsx.coffee
###* @jsx React.DOM ###
@MessageList = React.createClass

    displayName: 'messageList'

    render: ->
        return (
            `<div className="messageList">
                qwe
            </div>`
            )

但是在浏览器中我有：未捕获的ReferenceError：未定义MessageList

如何将MessageList连接到ChatApp？

Answer 1

使用Rails，您可以将所有JSX文件放在components内的app/assets/javascripts文件夹中，并使用以下内容创建另一个文件app/assets/javascripts/components.js：

//= require_tree ./components

确保您的application.js文件有//= require_tree .（或添加//= require components），您将拥有：

从应用程序布局中的默认javascript include标记中为您加载的所有组件
在提供页面之前在服务器上预呈现组件的可能性

我在本博文中详细描述了该过程：Isomorphic React app with Ruby on Rails

从另一个文件连接reactjs组件

1 个答案: