此时不允许MobX副作用，例如更改状态

Question

我不是试图从渲染函数修改状态。 实际上，如果我删除<ul>标签就行了。 我不知道该说些什么。 请让StackOverflow允许我发布此信息（对不起）

@observer
class LeftMenu extends Component {
  @observable rows = [];

  componentDidMount() {
    this.renderRows(this.props.shareFiles);
  }

  renderRows = async (data, prevDir = "") => {
    const tempDir = prevDir;
    for (const dir of data) {
      const subDirectories = await API.browseFolder.getFiles({
        shareName: this.props.shareName,
        dirPath: prevDir === "" ? `${dir.name}` : `${tempDir}${dir.name}`
      });
      if (subDirectories.data.length) {
        prevDir += dir.name + "/";
        this.rows.push(
          <ul styleName="Main-row">
            {/* here's an error occurred */}
            <FolderRow onClick={this.onClick} label={dir.name} />
          </ul>
        );
        this.renderRows(subDirectories.data, prevDir);
      } else {
        this.rows.push(
          <FolderRow onClick={this.onClick} key={dir.name} label={dir.name} />
        );
      }
    }
  };

  render() {
    const { shareName } = this.props;
    return (
      <div styleName="Container">
        <h3 styleName="Share-name">{shareName}</h3>
        <ul styleName="Main-row">{this.rows}</ul>
      </div>
    );
  }
}

我一整天都试图解决这个问题:)有什么想法吗？