首页 > 解决方案 > 在 set()'ing Map 之后,返回的对象不是 Map

问题描述

我正在尝试为我的州迁移到 immutable.js:

class Register extends Component<{}, Map<string, string>> {
    state = Map<string, string>();

    onInputValueChange(e) {
        const { name, value } = e.target;
        const newState = this.state.set(name, value);
        this.setState(newState);
    }



   render() {
        ...
        <input onChange={this.onInputValueChange.bind(this)} placeholder="john.doe@example.com" name="email" type="email" />   
   }
}

因此,每当我第一次输入内容时,它都能正常工作。但是每当我输入第二个字母时,我都会TypeError: this.state.set is not a function出错。如果我这样做Map.isMap(this.state),它会第一次返回 True,但之后每次都返回 False。

看到这个转载: http: //nixiedevelopment.club/register

标签: reactjstypescriptdictionaryimmutable.jsnext.js

解决方案


您不应该将整个状态设置为 Map,而是在您的状态中创建一个不可变变量:

class Register extends Component<{}, { data: Map<string, string> }> {
  state = {data: Map<string, string>()};

  onInputValueChange(e) {
      const { name, value } = e.target;
      this.setState(({ data }) => ({
        data: data.set(name, value),
      }));
  }
...
}

请查看wiki 页面以获取有关使用 Immutable 作为 React 状态的更多信息。


推荐阅读