Javascript 模块生成失败：SyntaxError:尝试呈现第二个组件时出现意外令牌错误

一般来说，我对ReactJs或UI编码比较陌生。我花了一整天的时间试图调试这个问题，但毫无结果。我的ReactJs应用程序-app.js中只有一个入口点

var React = require("react");
var ReactDOM = require("react-dom");
import Main from "./components/Main";
import Bucket from "./components/Bucket";
import Relay from "react-relay";

ReactDOM.render(<Main />,document.getElementById('react'));
ReactDOM.render(<Bucket />,document.getElementById('react-bucket'));

console.log(Relay.QL`query Test {ServerGroups {_id}}`);

---

非常感谢你的帮助。我真的被这个难住了

问题是，

return

应该返回一个对象，您可以尝试用

div

包装它们

return(
    <div>
        <tr><td key={oneAppBucket.app_name}>{oneAppBucket.app_name}</td></tr>
        {justBucketDOMElement}    **// this is where the error happens**
    </div>
)

返回(
{oneAppBucket.app_name}
{justBucketDomeElement}**//这就是发生错误的地方**
)

谢谢！谢谢您！现在开始讨论下一个问题。

render(){
  return(
    <table>
      <tbody>
      <tr>
        <th>AppName</th>
        <th>BucketName</th>
        <th>RAMQuotaInGB</th>
        <th>ReplicaNumber</th>
        <th>ServerList</th>
      </tr>
      {
        this.state.allBuckets.map(function(oneAppBucket){
          var justBucketDOMElement = oneAppBucket.buckets.map(function(bucketInfo){
            return(
              <tr>
                <td key={bucketInfo.bucket_name}>{bucketInfo.bucket_name}</td>
                <td key={bucketInfo.bucket_name}>{bucketInfo.evictionPolicy}</td>
                <td key={bucketInfo.RAMQuota}>{bucketInfo.RAMQuota}</td>
                <td key={bucketInfo.ReplicaNumber}>{bucketInfo.ReplicaNumber}</td>
                <td key={bucketInfo.ServerList[0]}>{bucketInfo.ServerList.join(",")}</td>
              </tr>
            )
          });
          return(
            <tr><td key={oneAppBucket.app_name}>{oneAppBucket.app_name}</td></tr>
          {justBucketDOMElement}    **// this is where the error happens**
          )
        })
      }
      </tbody>
    </table>
  );
}

 {
"BucketList": [
  {
    "app_name": "gem",
    "buckets": [
      {
        "evictionPolicy": "valueOnly",
        "RAMQuota": 3,
        "ReplicaNumber": 1,
        "ServerList": [
          "lpdcbc01a.phx.aexp.com:11210",
          "lpdcbc01b.phx.aexp.com:11210",
          "lpdcbc01c.phx.aexp.com:11210"
        ],
        "bucket_name": "config"
      },
      {
        "evictionPolicy": "valueOnly",
        "RAMQuota": 3,
        "ReplicaNumber": 1,
        "ServerList": [
          "lpdcbc01a.phx.aexp.com:11210",
          "lpdcbc01b.phx.aexp.com:11210",
          "lpdcbc01c.phx.aexp.com:11210"
        ],
        "bucket_name": "failed_events"
      },
      {
        "evictionPolicy": "valueOnly",
        "RAMQuota": 6,
        "ReplicaNumber": 1,
        "ServerList": [
          "lpdcbc01a.phx.aexp.com:11210",
          "lpdcbc01b.phx.aexp.com:11210",
          "lpdcbc01c.phx.aexp.com:11210"
        ],
        "bucket_name": "events"
      }
    ]
  }

return(
    <div>
        <tr><td key={oneAppBucket.app_name}>{oneAppBucket.app_name}</td></tr>
        {justBucketDOMElement}    **// this is where the error happens**
    </div>
)