传递参数时反应路由器不起作用答案

【问题标题】：React Router when passed param doesnt work传递参数时反应路由器不起作用
【发布时间】：2019-11-15 14:03:28
【问题描述】：

<Route path='/confirmAccount/:link' component={ConfirmationPage} />

这行代码在浏览器控制台抛出错误---> "Uncaught SyntaxError: Unexpected token

<Route path='/confirmAccount' component={ConfirmationPage} />

没有 '/:link' 可以正常工作并完美呈现。

我不知道如何使用"Uncaught SyntaxError: Unexpected token < bundle.js:1" 作为错误消息来解决此问题

import React from 'react';
import { connect } from 'react-redux'
import Grid from '@material-ui/core/Grid'

class ConfirmationPage extends React.Component {

    render() {
        //let loading = this.props.loading;
        let loading = true;
        return (
            <Grid container>
                <Grid>
                    {(loading) && 'Confirming Account. Please wait ....'}
                </Grid>
            </Grid>
        )
    }
}
const mapStateToProps = ({auth}) => {
    const { loading } = auth;
    return ({
        loading
    })
}
export default connect(mapStateToProps)(withStyles(styles)(ConfirmationPage));

更新：答案部分中此特定问题的解决方案

【问题讨论】：

这里看起来不错。它可能来自您的组件或其他地方
当我转到“localhost:9000/confirmAccount”时，组件会重新渲染。但是当我转到 'localhost:9000/confirmAccount/someString' 时，它会因“Uncaught SyntaxError: Unexpected token
你能发布你的组件的最小可重现代码吗？
在问题中添加了最小组件

标签： javascript reactjs react-router-dom

【解决方案1】：

你的代码看起来不错，所以一个解决方案是点击 npm install 可能会解决问题，其次你可以搜索你的项目并检查 publicPath 是否设置为publicPath: '/', 祝你好运:)

【讨论】：

output: { publicPath: '/' //

【解决方案2】：

<Route path='/confirmAccount:hash' component={ConfirmationPage} />

如果你将上面声明为路由并使用下面的内容作为 url

localhost:9000/cofirmAccountThisWorks

这导致this.props.match.params.hash => ThisWorks

我仍然不知道为什么<Route path='/confirmAccount/:hash' component={ConfirmationPage} /> 抛出错误说Uncaught SyntaxError: Unexpected token <

更新：

在另一篇文章中找到了答案 -> https://stackoverflow.com/a/35302590/11711797

在我的索引文件中我有<script type="text/javascript" src="./bundle.js"></script>，所以如果我想使用参数我必须使用<Route path='/confirmAccount:hash' component={ConfirmationPage} />

现在如果我想使用 <Route path='/confirmAccount/:hash' component={ConfirmationPage} /> 我必须将 <script type="text/javascript" src="./bundle.js"></script> 更改为 => <script type="text/javascript" src="/bundle.js"></script> src="./bundle.js" 需要 src="/bundle.js"

【讨论】：