使用React.js的Welcome＃索引中的ExecJS :: RuntimeError

我已经开始使用Rails后端学习React.js，现在我坚持使用简单的任务来显示用户。该代码是下面的：使用React.js的Welcome＃索引中的ExecJS :: RuntimeError

的application.js：

//= require jquery 
//= require jquery_ujs 
//= require bootstrap 
//= require turbolinks 
//= require react 
//= require react_ujs 
//= require components 
//= require_tree .

components.js：

//= require_tree ./components

index.html.erb：

<%= react_component 'Users', { data: @users } %>

资产/ Java脚本/组件/ users.js.coffee：

@Users = React.createClass 
    getInitialState: -> 
     users: @props.data 
    getDefaultProps: -> 
     users: [] 
    render: -> 
     React.DOM.div null, 
      className: 'users' 
      for user in @state.users

资产/ Java脚本/组件/ user.js.coffee：

@User = React.createClass 
    render: -> 
     React.DOM.img null, @props.user.avatar 
     React.DOM.p null, @props.user.username

此代码返回我ExecJS::RuntimeError in Welcome#index，和具体如下：

SyntaxError: [stdin]:9:28: unexpected indentation 

Extracted source (around line #6): 

<head> 
    <title>Testingapp</title> 
    <!-- the line #6 goes below, stylesheet_link_tag --> 
    <%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track' => true %> 
    <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %> 
    <%= csrf_meta_tags %> 
</head>

我试图删除

//= require tree .

从的application.js和components.js我改变

//= require tree ./components

线

//= require components

和错误，则自败，但反应少了点工作。

来源

2016-05-17 AlexNikolaev94

它在for user in @state.users行失败。您可以尝试在className: 'users'之后添加逗号，因为React元素接受儿童作为最后一个参数，这就是您可能要做的事情。

您应该结束了，像这样：

render: -> 
    React.DOM.div null, 
     className: 'users', 
     (@User(user: user, key: user.username) for user in users)

作为一个侧面说明，考虑关闭服务器端呈现在反应护栏，直到你有你的代码在浏览器中运行。这将使调试更容易。

来源

2016-05-17 11:50:26 kulesa

谢谢！我尝试了你的建议，然后错误消失了，但是没有显示任何东西:( – AlexNikolaev94

那么，你需要从这里开始调试。在所有地方添加一些console.log语句，禁用服务器端渲染并找出发生了什么对用户数组有什么要求吗？你可以立即修复的另一件事是'@ User'中的'render'函数：你需要将它封装在一个div中，否则它只返回两个语句中的后一个'React。 DOM.p'。 – kulesa

使用React.js的Welcome＃索引中的ExecJS :: RuntimeError

回答

相关问题