我一直在阅读本教程:http://tylermcginnis.com/reactjs-tutorial-a-comprehensive-guide-to-building-apps-with-react/ ，并在使用 Nashorn 在 JVM 上渲染 React 时遇到问题。

我的App.js文件如下。在客户端上运行时它可以正常工作。只是在使用 Nashorn/JVM 时报错:

var App = React.createClass({
  getInitialState: function(){
    return {
      name: 'Tyler McGinnis',
      friends: ['Jake Lingwall', 'Murphy Randall', 'Merrick Christensen'],
    }
  },
  addFriend: function(friend){
    this.setState({
      friends: this.state.friends.concat([friend])
    });
  },
  render: function(){
    return (
      <div>
        <h3> Name: {this.state.name} </h3>
        <AddFriend addNew={this.addFriend} />
        <ShowList names={this.state.friends} />
      </div>
    )
  }
});

var AddFriend = React.createClass({
  getInitialState: function(){
    return {
      newFriend: ''
    }
  },
  updateNewFriend: function(e){
    this.setState({
      newFriend: e.target.value
    });
  },
  handleAddNew: function(){
    this.props.addNew(this.state.newFriend);
    this.setState({
      newFriend: ''
    });
  },
  render: function(){
    return (
        <div>
          <input type="text" value={this.state.newFriend} onChange={this.updateNewFriend} />
          <button onClick={this.handleAddNew}> Add Friend </button>
        </div>
    );
  }
});

var ShowList = React.createClass({
  render: function(){
    var listItems = this.props.names.map(function(friend){
      return <li> {friend} </li>;
    });
    return (
      <div>
        <h3> Friends </h3>
        <ul>
          {listItems}
        </ul>
      </div>
    )
  }
});

我的 JVM 代码:

ScriptEngine engine = new ScriptEngineManager(null).getEngineByName("nashorn");

String script = "var global = this;" +
    "console = {log: print, warn: print, error: print};";

engine.eval (script);

// Evaluate React and the application code.
engine.eval(new FileReader("target/web/web-modules/main/webjars/lib/react/react-with-addons.js"));
engine.eval(new FileReader("target/web/public/main/javascripts/components/App.js"));
html = engine.eval("React.renderToString(React.createElement(App));").toString();

当我运行这段代码时，我得到以下堆栈跟踪错误:

Warning: ReactDOMButton(...): No `render` method found on the returned component instance: you may have forgotten to define `render` in your component or you may have accidentally tried to render an element whose type is a function that isn't a React component.
Warning: getInitialState was defined on ReactDOMButton, a plain JavaScript class. This is only supported for classes created using React.createClass. Did you mean to define a state property instead?
javax.script.ScriptException: TypeError: null is not a function in <eval> at line number 7395
    at jdk.nashorn.api.scripting.NashornScriptEngine.throwAsScriptException(NashornScriptEngine.java:586)
    at jdk.nashorn.api.scripting.NashornScriptEngine.evalImpl(NashornScriptEngine.java:570)
    at jdk.nashorn.api.scripting.NashornScriptEngine.evalImpl(NashornScriptEngine.java:525)
    at jdk.nashorn.api.scripting.NashornScriptEngine.evalImpl(NashornScriptEngine.java:521)
    at jdk.nashorn.api.scripting.NashornScriptEngine.eval(NashornScriptEngine.java:192)
    at javax.script.AbstractScriptEngine.eval(AbstractScriptEngine.java:264)
    at controllers.Application.index(Application.java:50)
    at Routes$$anonfun$routes$1$$anonfun$applyOrElse$1$$anonfun$apply$1.apply(routes_routing.scala:80)
    at Routes$$anonfun$routes$1$$anonfun$applyOrElse$1$$anonfun$apply$1.apply(routes_routing.scala:80)
    at play.core.Router$HandlerInvokerFactory$$anon$4.resultCall(Router.scala:264)
    at play.core.Router$HandlerInvokerFactory$JavaActionInvokerFactory$$anon$15$$anon$1.invocation(Router.scala:255)
    at play.core.j.JavaAction$$anon$1.call(JavaAction.scala:55)
    at play.core.j.JavaAction$$anonfun$11.apply(JavaAction.scala:82)
    at play.core.j.JavaAction$$anonfun$11.apply(JavaAction.scala:82)
    at scala.concurrent.impl.Future$PromiseCompletingRunnable.liftedTree1$1(Future.scala:24)
    at scala.concurrent.impl.Future$PromiseCompletingRunnable.run(Future.scala:24)
    at play.core.j.HttpExecutionContext$$anon$2.run(HttpExecutionContext.scala:40)
    at play.api.libs.iteratee.Execution$trampoline$.execute(Execution.scala:46)
    at play.core.j.HttpExecutionContext.execute(HttpExecutionContext.scala:32)
    at scala.concurrent.impl.Future$.apply(Future.scala:31)
    at scala.concurrent.Future$.apply(Future.scala:485)
    at play.core.j.JavaAction$class.apply(JavaAction.scala:82)
    at play.core.Router$HandlerInvokerFactory$JavaActionInvokerFactory$$anon$15$$anon$1.apply(Router.scala:252)
    at play.api.mvc.Action$$anonfun$apply$1$$anonfun$apply$4$$anonfun$apply$5.apply(Action.scala:130)
    at play.api.mvc.Action$$anonfun$apply$1$$anonfun$apply$4$$anonfun$apply$5.apply(Action.scala:130)
    at play.utils.Threads$.withContextClassLoader(Threads.scala:21)
    at play.api.mvc.Action$$anonfun$apply$1$$anonfun$apply$4.apply(Action.scala:129)
    at play.api.mvc.Action$$anonfun$apply$1$$anonfun$apply$4.apply(Action.scala:128)
    at scala.Option.map(Option.scala:145)
    at play.api.mvc.Action$$anonfun$apply$1.apply(Action.scala:128)
    at play.api.mvc.Action$$anonfun$apply$1.apply(Action.scala:121)
    at play.api.libs.iteratee.Iteratee$$anonfun$mapM$1.apply(Iteratee.scala:483)
    at play.api.libs.iteratee.Iteratee$$anonfun$mapM$1.apply(Iteratee.scala:483)
    at play.api.libs.iteratee.Iteratee$$anonfun$flatMapM$1.apply(Iteratee.scala:519)
    at play.api.libs.iteratee.Iteratee$$anonfun$flatMapM$1.apply(Iteratee.scala:519)
    at play.api.libs.iteratee.Iteratee$$anonfun$flatMap$1$$anonfun$apply$14.apply(Iteratee.scala:496)
    at play.api.libs.iteratee.Iteratee$$anonfun$flatMap$1$$anonfun$apply$14.apply(Iteratee.scala:496)
    at scala.concurrent.impl.Future$PromiseCompletingRunnable.liftedTree1$1(Future.scala:24)
    at scala.concurrent.impl.Future$PromiseCompletingRunnable.run(Future.scala:24)
    at akka.dispatch.TaskInvocation.run(AbstractDispatcher.scala:41)
    at akka.dispatch.ForkJoinExecutorConfigurator$AkkaForkJoinTask.exec(AbstractDispatcher.scala:393)
    at scala.concurrent.forkjoin.ForkJoinTask.doExec(ForkJoinTask.java:260)
    at scala.concurrent.forkjoin.ForkJoinPool$WorkQueue.runTask(ForkJoinPool.java:1339)
    at scala.concurrent.forkjoin.ForkJoinPool.runWorker(ForkJoinPool.java:1979)
    at scala.concurrent.forkjoin.ForkJoinWorkerThread.run(ForkJoinWorkerThread.java:107)
Caused by: <eval>:7395 TypeError: null is not a function
    at jdk.nashorn.internal.runtime.ECMAErrors.error(ECMAErrors.java:58)
    at jdk.nashorn.internal.runtime.ECMAErrors.typeError(ECMAErrors.java:214)
    at jdk.nashorn.internal.runtime.ECMAErrors.typeError(ECMAErrors.java:186)
    at jdk.nashorn.internal.runtime.ECMAErrors.typeError(ECMAErrors.java:173)
    at jdk.nashorn.internal.runtime.linker.NashornBottomLinker.linkNull(NashornBottomLinker.java:176)
    at jdk.nashorn.internal.runtime.linker.NashornBottomLinker.getGuardedInvocation(NashornBottomLinker.java:66)
    at jdk.internal.dynalink.support.CompositeGuardingDynamicLinker.getGuardedInvocation(CompositeGuardingDynamicLinker.java:124)
    at jdk.internal.dynalink.support.LinkerServicesImpl.getGuardedInvocation(LinkerServicesImpl.java:144)
    at jdk.internal.dynalink.DynamicLinker.relink(DynamicLinker.java:232)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$8.L:4-1$L:6628$L:7393(<eval>:7395)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$8.L:4-1$L:6628$L:7412(<eval>:7421)
    at jdk.nashorn.internal.runtime.ScriptFunctionData.invoke(ScriptFunctionData.java:535)
    at jdk.nashorn.internal.runtime.ScriptFunction.invoke(ScriptFunction.java:209)
    at jdk.nashorn.internal.runtime.ScriptRuntime.apply(ScriptRuntime.java:378)
    at jdk.nashorn.internal.objects.NativeFunction.apply(NativeFunction.java:130)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$15.L:4-1$L:13839$L:13899$L:13902(<eval>:13909)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$8.L:4-1$L:6628$L:6750(<eval>:6855)
    at jdk.nashorn.internal.runtime.ScriptFunctionData.invoke(ScriptFunctionData.java:541)
    at jdk.nashorn.internal.runtime.ScriptFunction.invoke(ScriptFunction.java:209)
    at jdk.nashorn.internal.runtime.ScriptRuntime.apply(ScriptRuntime.java:378)
    at jdk.nashorn.internal.objects.NativeFunction.apply(NativeFunction.java:130)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$15.L:4-1$L:13839$L:13899$L:13902(<eval>:13909)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$15.L:4-1$L:14682$L:14719(<eval>:14720)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$14.L:4-1$L:13161$L:13341(<eval>:13353)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$9.L:4-1$L:7866$L:8127(<eval>:8153)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$9.L:4-1$L:7866$L:8057(<eval>:8063)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$15.L:4-1$L:14682$L:14719(<eval>:14720)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$8.L:4-1$L:6628$L:6750(<eval>:6869)
    at jdk.nashorn.internal.runtime.ScriptFunctionData.invoke(ScriptFunctionData.java:541)
    at jdk.nashorn.internal.runtime.ScriptFunction.invoke(ScriptFunction.java:209)
    at jdk.nashorn.internal.runtime.ScriptRuntime.apply(ScriptRuntime.java:378)
    at jdk.nashorn.internal.objects.NativeFunction.apply(NativeFunction.java:130)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$15.L:4-1$L:13839$L:13899$L:13902(<eval>:13909)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$15.L:4-1$L:14682$L:14719(<eval>:14720)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$8.L:4-1$L:6628$L:6750(<eval>:6869)
    at jdk.nashorn.internal.runtime.ScriptFunctionData.invoke(ScriptFunctionData.java:541)
    at jdk.nashorn.internal.runtime.ScriptFunction.invoke(ScriptFunction.java:209)
    at jdk.nashorn.internal.runtime.ScriptRuntime.apply(ScriptRuntime.java:378)
    at jdk.nashorn.internal.objects.NativeFunction.apply(NativeFunction.java:130)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$15.L:4-1$L:13839$L:13899$L:13902(<eval>:13909)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$15.L:4-1$L:14682$L:14719(<eval>:14720)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$14.L:4-1$L:13161$L:13341(<eval>:13353)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$9.L:4-1$L:7866$L:8127(<eval>:8153)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$9.L:4-1$L:7866$L:8057(<eval>:8063)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$15.L:4-1$L:14682$L:14719(<eval>:14720)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$8.L:4-1$L:6628$L:6750(<eval>:6869)
    at jdk.nashorn.internal.runtime.ScriptFunctionData.invoke(ScriptFunctionData.java:541)
    at jdk.nashorn.internal.runtime.ScriptFunction.invoke(ScriptFunction.java:209)
    at jdk.nashorn.internal.runtime.ScriptRuntime.apply(ScriptRuntime.java:378)
    at jdk.nashorn.internal.objects.NativeFunction.apply(NativeFunction.java:130)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$15.L:4-1$L:13839$L:13899$L:13902(<eval>:13909)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$15.L:4-1$L:14682$L:14719(<eval>:14720)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$8.L:4-1$L:6628$L:6750(<eval>:6869)
    at jdk.nashorn.internal.runtime.ScriptFunctionData.invoke(ScriptFunctionData.java:541)
    at jdk.nashorn.internal.runtime.ScriptFunction.invoke(ScriptFunction.java:209)
    at jdk.nashorn.internal.runtime.ScriptRuntime.apply(ScriptRuntime.java:378)
    at jdk.nashorn.internal.objects.NativeFunction.apply(NativeFunction.java:130)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$15.L:4-1$L:13839$L:13899$L:13902(<eval>:13909)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$16.L:4-1$L:14906$renderToString$L:14945(<eval>:14948)
    at jdk.nashorn.internal.runtime.ScriptFunctionData.invoke(ScriptFunctionData.java:535)
    at jdk.nashorn.internal.runtime.ScriptFunction.invoke(ScriptFunction.java:209)
    at jdk.nashorn.internal.runtime.ScriptRuntime.apply(ScriptRuntime.java:378)
    at jdk.nashorn.internal.objects.NativeFunction.call(NativeFunction.java:162)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$19.L:4-1$L:18201$L:18319(<eval>:18335)
    at jdk.nashorn.internal.scripts.Script$\^eval\_$16.L:4-1$L:14906$renderToString(<eval>:14945)
    at jdk.nashorn.internal.scripts.Script$\^eval\_.runScript(<eval>:1)
    at jdk.nashorn.internal.runtime.ScriptFunctionData.invoke(ScriptFunctionData.java:535)
    at jdk.nashorn.internal.runtime.ScriptFunction.invoke(ScriptFunction.java:209)
    at jdk.nashorn.internal.runtime.ScriptRuntime.apply(ScriptRuntime.java:378)
    at jdk.nashorn.api.scripting.NashornScriptEngine.evalImpl(NashornScriptEngine.java:568)
    ... 43 more

如果我删除这一行:

<button onClick={this.handleAddNew}> Add Friend </button>

来自 AddFriend 渲染函数，然后错误消失。

编辑

如果我尝试打印上面按钮元素的结果，请执行以下操作:

function makeString(button){
    var objStr = '';
    for (var member in button) {
        objStr += (objStr ? ',\n': '')+
            member + ':' + button[member] + '';
    }
    return objStr;
}

var button = React.createElement("button", {onClick: this.handleAddNew}, " Add Friend ")
var bs = makeString(button);
bs += '\n\n*****_owner:\n\n';
bs += makeString(button['_owner']);
bs += '\n\n*****_context:\n\n';
bs += makeString(button['_context']);
bs += '\n\n*****_store:\n\n';
bs += makeString(button['_store']);
bs += '\n\n*****props:\n\n';
bs += makeString(button['props']);
console.log(bs);

我得到以下打印输出:http://pastebin.com/raw.php?i=hEMkN8UP

最佳答案

从这里回答:https://groups.google.com/forum/#!topic/play-framework/Oz8OC_fPdx8

“这显然是 8u25。更新 Nashorn 版本的结果:在 8u40 中抛出另一个异常；在 8u60 早期访问版本中工作得很好。”

我确认更新到 8u60 解决了我本地机器上的问题。

关于java - 使用 JVM Nashorn (Play Framework) 呈现 React.js 时出错。我得到 "null is not a function"，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/29429955/