无法在“历史"上执行“pushState":函数 addComment() ... 无法克隆 [英] Failed to execute 'pushState' on 'History': function addComment() ... could not be cloned

问题描述

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

I've tried to make my first app in React and I think I've made some serious error in the flow of the Application however trying to save it doesn't make it better.

我有我的 App.ksin

I got my App.ksin which I have

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

现在 AddComment 只是:

Right now AddComment is only:

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() ... 无法克隆.

Failed to execute 'pushState' on 'History': function addComment() ... could not be cloned.

导致错误的是参数:addComment: this.props.addComment

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

if I remove it everything works but I need to pass my function thos to my Recipe component. Which is in App.js

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

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

Which I need to pass all three arguments, recipe, index and the function addComment()

推荐答案

变化:

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

到:

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

在我的 App.js 中解决了它.

In my App.js solved it.

这篇关于无法在“历史"上执行“pushState":函数 addComment() ... 无法克隆的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！