如何在 React 功能组件中使用 Props 将 Redux 函数添加为参数答案

【问题标题】：How to Add Redux function as a Parameter with Props in React Functional Component如何在 React 功能组件中使用 Props 将 Redux 函数添加为参数
【发布时间】：2020-08-24 12:03:52
【问题描述】：

我在profilesActions中有一个函数“insertProfile”，我想在一个功能组件中使用它。

我将这个函数导入如下：

import { insertProfile } from "../../../actions/profilesActions";

Folwing 是我想在其中使用此功能的组件。

const ProfilesAdministration = (props,insertProfile) => {

// Code Here

}

export default connect(null, { insertProfile })( ProfilesAdministration );

我尝试了以下技术，但没有一个对我有用：

({props,insertProfile})

(props,{insertProfile})

({props},{insertProfile})

({insertProfile},props)

请帮忙..谢谢

【问题讨论】：

嘿，你能改进有问题的注释，即正确使用代码块。因为，我很难理解。
你可以这样做：const ProfilesAdministration = ({insertProfile}) => {
这是可行的，但我也想在我的组件中使用道具

标签： javascript reactjs redux react-functional-component

【解决方案1】：

我认为这是一个动作，因此您还需要调度它。您可以将此函数用作 mapDispatchToProps。

const mapDispatchToProps = {
 insertProfile: (payload) => dispatch(insertProfile(payload)) 
}

export default connect(null, mapDispatchToProps)( ProfilesAdministration );

现在，insertProfile 在组件的 props 中可用。所有你需要调用它。它会为你调度动作。

你可以这样使用它：props.insertProfile()。

您可以在此处查看更多信息：https://react-redux.js.org/7.1/api/connect#dispatch

希望对你有所帮助。

【讨论】：

现在这个错误显示“'dispatch' is not defined”
const mapDispatchToProps = (dispatch) => { return { insertProfile: (profile) => dispatch(insertProfile(profile)), }; };
以上代码解决了我的问题。但是你的回答很有帮助。谢谢你救了我。