Javascript 如何解决Typescript中关于`WithStateHandler'的错误`

Javascript 如何解决Typescript中关于`WithStateHandler'的错误`,javascript,reactjs,higher-order-components,recompose,Javascript,Reactjs,Higher Order Components,Recompose,我尝试使用HOC制作一个React示例应用程序。 但由于我在打字稿中出错,我不能再继续做下去了 我在下面收到了这个错误消息 (34,38): Type '{ timeLeft: number; timerId?: Timer | undefined; }' is not assignable to type 'StateHandler<LStateProps>'. Type '{ timeLeft: number; timerId?: Timer | undefined; }'

我尝试使用HOC制作一个React示例应用程序。 但由于我在打字稿中出错,我不能再继续做下去了

我在下面收到了这个错误消息

(34,38): Type '{ timeLeft: number; timerId?: Timer | undefined; }' is not assignable to type 'StateHandler<LStateProps>'.
  Type '{ timeLeft: number; timerId?: Timer | undefined; }' provides no match for the signature '(...payload: any[]): Partial<LStateProps> | undefined'.
(34,38):类型“{timeLeft:number;timerId?:Timer | undefined;}”不能分配给类型“StateHandler”。
类型“{timeLeft:number;timerId?:Timer | undefined;}”与签名“(…有效负载:any[]):Partial | undefined”不匹配。
你能告诉我怎么解决吗

import * as React from 'react';
import {
  compose,
  StateHandler,
  StateHandlerMap,
  withStateHandlers,
} from 'recompose';

import Timer, { TimerProps } from 'components/Timer';

interface LStateProps {
  timeLeft: number;
  timerId?: NodeJS.Timer;
}

type LStateHandlerProps = {
  reset: () => StateHandler<LStateProps>;
  tick: () => StateHandler<LStateProps>;
  setTimerId: (timerId: NodeJS.Timer) => StateHandler<LStateProps>;
} & StateHandlerMap<LStateProps>;

type EnhancedTimerProps = TimerProps & LStateProps & LStateHandlerProps;

const enhance = compose<EnhancedTimerProps, TimerProps>(
  withStateHandlers<LStateProps, LStateHandlerProps, TimerProps>(
    props => ({
      timeLeft: props.limit,
    }),
    {
      reset: (state, props) => () => ({
        ...state,
        timeLeft: props.limit,
      }),
      tick: (state, props) => () => ({
        ...state,
        timeLeft: state.timeLeft - 1,
      }),
      setTimerId: (state, props) => (timerId: NodeJS.Timer) => ({
        ...state,
        timerId,
      }),
    },
  ),
);

export default enhance(Timer as React.SFC<EnhancedTimerProps>);
import*as React from'React';
进口{
组成
州处理人,
州地图,
与政府官员一起,
}从"重组"开始,;
从“组件/计时器”导入计时器,{TimerProps};
接口LStateProps{
时间限制:数字;
timerId?:NodeJS.Timer;
}
类型LStateHandlerProps={
重置:()=>StateHandler;
勾选:()=>StateHandler;
setTimerId:(timerId:NodeJS.Timer)=>StateHandler;
}&StateHandlerMap;
类型EnhancedTimerOps=TimerOps&LStateProps&LStateHandlerProps;
常数增强=合成(
与国家处理者(
道具=>({
时间限制:props.limit,
}),
{
重置:(状态,道具)=>()=>({
……国家,
时间限制:props.limit,
}),
勾选:(状态,道具)=>()=>({
……国家,
timeLeft:state.timeLeft-1,
}),
setTimerId:(状态,道具)=>(timerId:NodeJS.Timer)=>({
……国家,
蒂梅丽德,
}),
},
),
);
导出默认增强(计时器为React.SFC);

解决方法是像这样简单地更改您的类型
LStateHandlerProps

type LStateHandlerProps = {
  reset: StateHandler<LStateProps>;
  tick: StateHandler<LStateParops>;
  setTimerId: StateHandler<LStateProps>;
} & StateHandlerMap<LStateProps>;
reset(state: LStateProps, props: TimerProps): () => StateHandler<LStateProps>

“我可以继续做下去了。”????Huh?1)如果您右键单击导入中的StateHandler并选择go to definition,是否需要在IDE中编写代码?2) 你用的是什么版本的重组?我承认对React不太了解。但从声音上看,LStateProps可能应该扩展StateHandler中的一些接口。看到这些线了吗。
type StateHandler<TState> = (...payload: any[]) => Partial<TState> | undefined;
 reset: (state, props) => () => ({
     ...state,
     timeLeft: props.limit,
 })