javascript - 如何通过onChange在 react 中更改图标

Question

我尝试设置 onChange 来改变图标。
但它不起作用。

前端:React
CSS:语义用户界面 react

  constructor(props: {}) {
    super(props);
    this.state = {
      icon: 'image',
    };
    this.changeIcon = this.changeIcon.bind(this);
  }

  changeIcon() {
    this.setState({icon: 'delete'});
    console.log(this.state.icon);
  }

  render() {
    return (
          <List>
            {(this.state.files || []).map((file, i) => {
              return (
                <List.Item
                  //icon="image"
                  icon={`${this.state.icon}`}
                  content={file.name}
                  onClick={this.handleRemove}
                  onChange={this.changeIcon}
                />
              );
            })}
          </List>
    );
  }

完整代码在这里:
https://github.com/jpskgc/article/blob/master/client/src/components/Detail.tsx

我希望 onChange 能够将图标从图像更改为删除。
但实际并没有。

Answer 1

正如他们在文档中所说的那样 changing state might be asynchronous .

也许您可以尝试传递一个函数而不是将对象传递给 setState？

希望对您有所帮助:)