无法在“历史”上执行“pushState”：函数 addComment() ... 无法克隆

Question

我尝试在 React 中制作我的第一个应用程序，但我认为我在应用程序的流程中犯了一些严重错误，但是尝试保存它并不能让它变得更好。

我得到了我的 App.ksin

<LatestRecipes latestRecipes={this.state.latestRecipes} allRecipes={this.state.recipes} addComment={this.addComment}/>

现在 AddComment 只是：

addComment(key, commentData)
{
    console.log(key);
    console.log(commentData);
}

在我最新的食谱中：

<Link to={{pathname: '/recipe/' + recipe.name, state: { recipe: recipe, index: index, addComment: this.props.addComment }}}>{recipe.name}</Link>    

这给了我错误：

在“历史”上执行“pushState”失败：函数 addComment() ... 无法克隆。

造成错误的是参数： addComment: this.props.addComment

如果我删除它一切正常，但我需要将我的函数传递给我的食谱组件。哪个在 App.js 中

<Route path="/recipe/:recipe" component={Recipe}/>

我需要传递所有三个参数，recipe、index 和函数 addComment()

Answer 1

变化：

<Route path="/recipe/:recipe" component={Recipe}/>

到：

<Route path="/recipe/:recipe" render={(props) => <Recipe {...props} addComment={this.addComment}/>} />

在我的 App.js 中解决了。