Javascript 从子级到父级的react中从redux传递的调用方法

我习惯于调用从主根组件传递到嵌套组件的方法。我正在从redux传递那个函数，不知怎的，我遇到了问题，无法执行它

postActions.js

export function deletePost(id) {
        const request = axios.delete(`http://localhost:3000/api/posts/${id}`);
        return {
        type: "DELETE_POST",
        payload: request
    }
}

render(){    
    return(
        <div> 
            <main>   
                <Post deletePost={this.props.deletePost)} />
            </main>
        </div>
    ); 
    }

App.js（主根组件）

此外，在我的应用程序组件（根）中，我有一个带有此PropsRoute的render方法，它类似于普通路由，但允许我传递道具

<PropsRoute path={"/posts/:id/:title"}  deletePost={this.props.deletePost} component={Posts} {...this.props.match} />  

export default connect(mapStateToProps, mapDispatchToProps)(App);

---

这很有效，但我不想这样使用它，我希望它更清晰。有什么帮助吗？感谢您在your Posts.js中，将deletePost作为Post组件的道具传递。因此，在Post.js中，this.deletePost应更改为this.props.deletePost

render(){
    return (
        <LabelDelete handleDelete={this.props.deletePost} id={id}  
            {...this.props.children}/>
    )
}

render（）{
返回(
)
}

在your Posts.js中，您将deletePost作为Post组件的道具传递。因此，在Post.js中，this.deletePost应更改为this.props.deletePost

render(){
    return (
        <LabelDelete handleDelete={this.props.deletePost} id={id}  
            {...this.props.children}/>
    )
}

render（）{
返回(
)
}

是，但deletePost是一个函数，我必须传递ID，所以我应该如何编写它？比如（）=>this.props.deletePost（id）？即使我写了它，我也会出错_this2.props.deletePost不是一个function@Ivan在这种情况下，您可以将deleteId作为LabelDelete的另一个props传递给LabelDelete，并在LabelDelete组件中使用它，就像这样。props.handleDelete（this.props.deleteId）是的，但是deletePost是一个函数，我必须传递ID，所以我应该如何编写它？比如（）=>this.props.deletePost（id）？即使我写了它，我也会出错_this2.props.deletePost不是一个function@Ivan在这种情况下，您只需将deleteId作为LabelDelete的另一个props传递，并在LabelDelete组件中使用它，如下面的.props.handleDelete（this.props.deleteId）

const LabelDelete = (props) => (<span><button onClick={props.handleDelete}>Delete</button></span>);

<LabelDelete handleDelete={this.handleDelete.bind(this)} id={id}  {...this.props.children}/>

handleDelete(){
    var id = this.props.id; 
    $.ajax({ 
        type:"DELETE",
        url:`http://localhost:3000/api/posts/${id}`, 
        success: function(res) { 
            setTimeout(function () {
              location.pathname="/user";
            }, 500);
        }.bind(this),
        error: function(xhr, status, err) {
            console.error(xhr, status, err.toString());
        }.bind(this)
      }); 
  }   

render(){
    return (
        <LabelDelete handleDelete={this.props.deletePost} id={id}  
            {...this.props.children}/>
    )
}