我看过类似的帖子，但找不到答案，就我而言，我正试图通过以下方式采取行动<App />：
addExpense = (expense) => {
console.log('Hello From AddExpenseForm');
}
到/create路线在那里我渲染<AddExpenseForm />组件
<Link to={{
pathname: '/create',
state: { addExpense: this.addExpense }
}}> Create Expense</Link>
链接已呈现，但是当我单击它时，控制台出现错误：
Uncaught DOMException: Failed to execute 'pushState' on 'History': function (expense) {
console.log('Hello From addExpense');
} could not be cloned
为什么会这样，这里的解决方法是什么？
Index.js中的路由：
const Routes = () => {
return (
<BrowserRouter>
<Switch>
<Route path="/" exact component={App} />
<Route path="/create" exact component={AddExpenseForm}/>
<Route path="/expense/:expenseId" name="routename" component={ExpenseDetails} />
<Route component={NotFound} />
</Switch>
</BrowserRouter>
)
}
App.js：
addExpense = (expense = {}) => {
console.log('Hello From AddExpenseForm');
}
goToNextPage = (addExpense) => {
this.props.history.push({
pathname: '/create',
state: { addExpense: this.addExpense }
});
}
render() {
return (
<div>
<Header
/>
<button onClick={this.goToNextPage}>Create</button>
...
首先，向您的addExpense函数添加一些默认值：
addExpense = (expense = DEFAULT) => {
console.log('Hello From addExpense');
}
然后使用Link：
<Link to={`/ideas/${this.addExpense}`}>Create Expense</Link>
或尝试以下方法（更好的方法）：
goToNextPage = (addExpense) => {
this.props.history.push({
pathname: '/create',
state: { addExpense: addExpense }
});
}
在next（create）组件中，使用传递的值，如下所示：
this.props.location.state.addExpense();
本文收集自互联网，转载请注明来源。
如有侵权，请联系 [email protected] 删除。
我来说两句