Reactjs 对组件DIDMOUNT的React Redux调度作出反应->；属性不存在

我正在使用React+Redux处理我的第一个项目，当我尝试在componentDidMount部分中分派函数时，遇到了一些问题。我试着在文档中跟踪这个项目，但由于它们使用JavaScript，我使用的是TypeScript，所以并非所有内容都是一样的

这是我试图实现的React组件：

export class EducationComponent extends Component {
    constructor(props: any) {
        super(props);
    }

    componentDidMount() {
        const { dispatch, getUser } = this.props;
        dispatch(getUser());
    }
    public render() {
        return (
            <Content className="component">
                <Demo/>
            </Content>
        );
    }
}

function mapStateToProps(state: State) {
    const { isLoaded, isFetching, user } = state.userProfile;
    return {
        user,
        isFetching,
        isLoaded
    }
}

export default connect(mapStateToProps)(EducationComponent)
export const Education = (EducationComponent);

如果存在任何不确定性，可在此处找到该项目：

这是正确的方法还是有更好的选择

谢谢

使用当前状态编辑：

const {Content} = Layout;

export class EducationComponent extends Component {
    constructor(props: any) {
        super(props);
    }

    componentDidMount() {
        this.props.userAction();
    }
    public render() {
        return (
            <Content className="component">
                <Demo/>
            </Content>
        );
    }
}

const mapDispatchToProps = (dispatch: Dispatch) => bindActionCreators({
    userAction: action.getUser,
}, dispatch);

function mapStateToProps(state: State) {
    const { isLoaded, isFetching, user } = state.userProfile;
    return {
        user,
        isFetching,
        isLoaded
    }
}

export default connect(mapStateToProps, mapDispatchToProps)(EducationComponent)

const{Content}=Layout；
导出类EducationComponent扩展组件{
构造器（道具：任何）{
超级（道具）；
}
componentDidMount（）{
this.props.userAction（）；
}
公共渲染（）{
返回(
);
}
}
const mapDispatchToProps=（调度：调度）=>bindActionCreators({
userAction:action.getUser，
}，派遣）；
函数MapStateTops（状态：state）{
const{isLoaded，isFetching，user}=state.userProfile；
返回{
使用者
很吸引人，
孤岛
}
}
导出默认连接（MapStateTrops、mapDispatchToProps）（教育组件）

最终编辑（使其正常工作）：

接口MyProps{
getUser:（）=>void
}
接口MyState{
userAction:ThunkAction
}
导出类EducationComponent扩展组件{
静态defaultProps={getUser:undefined}；
构造器（道具：任何）{
超级（道具）；
}
componentDidMount（）{
this.props.getUser（）
}
公共渲染（）{
返回(
);
}
}
const mapDispatchToProps=（调度：ThunkDispatch，ownProps:MyProps）=>{
返回{
getUser:（）=>{
调度（getUser（））；
}
}
}
函数MapStateTops（状态：state）{
const{isLoaded，isFetching，user}=state.userProfile；
返回{
使用者
很吸引人，
孤岛
}
}
导出默认连接（MapStateTrops、mapDispatchToProps）（教育组件）

你可以这样做

componentDidMount() {
   this.props.getUser();
}

// mapStateToProps

mapDispatchToProps = (state) => {
   getUser: () => dispatch(getUser()); //Don't forget to import getUser from your action creator
}

export default connect(mapStateToProps, mapDispatchToProps)(EducationComponent)
export const Education = (EducationComponent); // Delete this line no need for this because you're already exporting it as default

---

参考资料：

您可以这样做

componentDidMount() {
   this.props.getUser();
}

// mapStateToProps

mapDispatchToProps = (state) => {
   getUser: () => dispatch(getUser()); //Don't forget to import getUser from your action creator
}

export default connect(mapStateToProps, mapDispatchToProps)(EducationComponent)
export const Education = (EducationComponent); // Delete this line no need for this because you're already exporting it as default

---

参考：

是否使用

mapDispatchToProps

绑定分派方法？

是否使用

mapDispatchToProps

绑定分派方法？

查看项目后，导入组件如下：

import {Education} from "../pages/Public/Education";

这将导入未连接的组件，这就是您无法访问dispatch的原因

您应该导入默认连接的组件：

import Education from "../pages/Public/Education";

---

查看项目后，您将导入组件，如下所示：

import {Education} from "../pages/Public/Education";

这将导入未连接的组件，这就是您无法访问dispatch的原因

您应该导入默认连接的组件：

import Education from "../pages/Public/Education";

---

这些是typescript错误。您好，请尝试此存储库。您可以尝试

客户端

文件夹react代码。这些是类型脚本错误。您好，请尝试此存储库。您尝试了

客户端

文件夹react code。感谢您的建议，我已经添加了代码的当前状态，因为它仍然无法工作。我只是无法访问道具中的userAction…您是在执行导入{EducationComponent}，还是导入EducationComponent？抱歉，我应该提到我按照您的建议导入它，如下所示：

导入EducationComponent

，谢谢您的建议，我已经添加了代码的当前状态，因为它仍然不工作。我只是无法访问道具中的userAction…您是在执行导入{EducationComponent}，还是导入EducationComponent？抱歉，我应该提到我按照您的建议导入它，如下所示：

导入EducationComponent

，谢谢您的建议，我已经添加了代码的当前状态，因为它仍然不工作。我只是无法访问道具中的userAction…您可以尝试像这样编写mapDispatchToProps

const mapDispatchToProps=dispatch=>{return{//dispatch actions由动作创建者返回增量：（）=>dispatch（increment（）），decrement:（）=>dispatch（decrement（）），reset:（）=>dispatch（reset（））}

感谢您的帮助，但没有成功。我使用的是TypeScript，而不是JavaScript，因此遵循您的指导原则有点困难…@In0cenT这可能会解决问题，因为TS不知道Dispatch的类型谢谢您的建议，我已经添加了代码的当前状态，因为它仍然不工作。我只是无法访问道具中的userAction…您可以尝试像这样编写mapDispatchToProps

const mapDispatchToProps=dispatch=>{return{//dispatch actions由动作创建者返回增量：（）=>dispatch（increment（）），decrement:（）=>dispatch（decrement（）），reset:（）=>dispatch（reset（））}

感谢您的帮助，但没有成功。我使用的是TypeScript，而不是JavaScript，因此遵循您的指导原则有点困难…@In0cenT这可能会解决问题，因为TS不知道分派的类型