Question

导致此错误的原因是什么？

Syntax error: Unexpected token, expected ,
{ Object.keys(form_routes).map( (key,index) => <Route path={key} component={{ form_routes[key] }}></Route> ) }

在{{ form_routes[key] }}

完整的相关代码：

const form_routes = {
    'start': "Start",
    'part1': "Part1",
    'part2': "Part2",
    'part3': "Part3",
    'part4': "Part4",
    'part5': "Part5",
    'part6': "Part6"
}

ReactDOM.render(
    <Provider store={store}>
      <Router history={hashHistory} render={applyMiddleware(useRelativeLinks())}>
        <Route path="/" component={App}>
            <IndexRedirect to='/search'/>
            <Route path='main' component={MainMenu}/>
            <Route path='search' component={Search}/>
            <Route path='form' component={Form}>
                <IndexRedirect to='start'/>
                { Object.keys(form_routes).map( (key,index) => <Route path={key} component={{ form_routes[key] }}></Route> ) }
            </Route>
        </Route>
      </Router>
    </Provider>,
    root
);

如果是普通的话：

<Route path='start' component={Start}></Route>
<Route path='part1' component={Part1}></Route>
<Route path='part2' component={Part2}></Route>
<Route path='part3' component={Part3}></Route>
<Route path='part4' component={Part4}></Route>
<Route path='part5' component={Part5}></Route>
<Route path='part6' component={Part6}></Route>

Answer 1

component={...}应该包含一个表达式。您提供的表达式为{ form_routes[key] }，这是一个无效的对象初始值设定项。这会触发相同的错误：

console.log({ form_routes[key] });

你可能只是想要component={ form_routes[key] }。

ReactDOM出现双花括号错误

1 个答案: