typescript 如何在setState()中传入键的名称?

lf5gs5x2  于 2022-11-30  发布在  TypeScript
关注(0)|答案(1)|浏览(106)

我有两个函数,除了调用setState()时的键名之外,其他代码都是重复的:

fooFunc(value: Moment) {
  if (condition){
   this.setState({foo: value});
  } else {
   doSomethingElse();
   this.setState({foo: undefined});
  }
}

barFunc(value: Moment) {
  if (condition){
   this.setState({bar: value});
  } else {
   doSomethingElse();
   this.setState({bar: undefined});
  }
}

如何将其重构为一个方法,该方法接受键的名称作为参数并相应地设置状态?

// something like this, but this doesn't work:
parameterizedFunc(name: string, value: Moment){
  if (condition){
    this.setState({[name]:value});
  } else {
    this.setState({[name]:undefined});
  }
}

使用上述技术时,我收到以下(编辑)错误消息:
“类型为”{ [x:字符串]:时刻。时刻;}"不能赋给“MyState”类型的参数|选择〈我的州,我的州的关键字〉|((先前状态:只读<...>,属性:只读<...>)=〉我的状态|...还有一个...|空值)|null“。\n类型”{ [x:字符串]:力矩;}'遗漏型别'Pick〈MyState,keyof MyState〉'的下列属性:aList、bList、cList、dList,以及其他8个列表。”

nle07wnf

nle07wnf1#

我发现我需要使用setState的“previous state”重载,并用它来填充“missing”属性:

parameterizedFunc(name: string, value: Moment){
  if (condition){
    this.setState(prevState => {...prevState, [name]:value});
  } else {
    this.setState(prevState => {...prevState, [name]:undefined});
  }
}

相关问题