javascript - typescript react /还原

Question

出现错误

ERROR in [at-loader] ./src/app/components/partials/userPartial.tsx:101:33
TS2339: Property 'level' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<{}, ComponentState>> & { children?: Reac...'.

ERROR in [at-loader] ./src/app/components/partials/userPartial.tsx:102:33
TS2339: Property 'medal' does not exist on type 'IntrinsicAttributes & IntrinsicClassAttributes<Component<{}, ComponentState>> & { children?: Reac...'.


但是提供了接口(interface)

我收到错误的组件

<NotificationTypes
   level={item.level}
   medal={item.medal}
   referred={item.user}
   points={item.points}
   type={item.type}
/>

提供接口(interface)的组件

export interface IPoints {
    earned: number,
    total: number
}

export interface INotificationTypesProps {
    level: any,
    medal: any,
    points: IPoints,
    type: number,
}

class NotificationTypes extends React.Component<INotificationTypesProps , any> {
    constructor(props:any){
        super(props);
    }


    render(){

        const { type, level, points, medal} = this.props;

        switch(type) {
            case 132:
                return (
                    <span>
                        <Translate value="notification.earned"/> <div
                        className='notify-medal medal-sm-yellow'>{medal}</div>
                    </span>
                );
            case 131:
                return (
                    <span>
                        <Translate value="notification.received"/> {points.earned} <Translate
                        value="notification.pointScored"/>
                        &nbsp;{points.total} <Translate value="notification.points"/>
                    </span>
                );
            default:
                return <div />
        }
    }
}

const mapStateToProps = (state) => {
    return {
        _CONFIG: state._CONFIG.CDN.static_uri,
    };
};
export default connect(mapStateToProps, null)(NotificationTypes);

如何解决这个冲突？我也有几个组件的类似错误为什么它不能按预期工作？

希望您的帮助!

Answer 1

我的猜测是，当您使用 NotificationTypes 组件时，您正在使用以下内容:

export default connect(mapStateToProps, null)(NotificationTypes);

从react-dedux的定义文件来看，connect函数有两个签名。
The first不是通用的，返回 InferableComponentDecorator :

export declare function connect(): InferableComponentDecorator;

但是the second是通用的，可用于返回通用 ComponentDecorator :

export declare function connect<TStateProps, TDispatchProps, TOwnProps>(
    mapStateToProps?: FuncOrSelf<MapStateToProps<TStateProps, TOwnProps>>,
    mapDispatchToProps?: FuncOrSelf<MapDispatchToPropsFunction<TDispatchProps, TOwnProps> | MapDispatchToPropsObject>,
    mergeProps?: MergeProps<TStateProps, TDispatchProps, TOwnProps>,
    options?: Options
): ComponentDecorator<TStateProps & TDispatchProps, TOwnProps>;

我没有使用过它，但你可能应该这样做:

export default connect<typeof mapStateToProps, {}, INotificationTypesProps >(mapStateToProps, null)(NotificationTypes);