不能在IconMenu中使用input.click()

Question

我正在尝试用https://github.com/callemall/material-ui实现智能图像上传工具。

它的顶部有占位符div元素和IconMenu。

我有以下代码：

onPlaceHolderClick = () => {
  this.input.click();
};

// ...

<IconMenu
  iconButtonElement={<IconButton><MoreVertIcon /></IconButton>}
  anchorOrigin={{ horizontal: 'right', vertical: 'top' }}
  targetOrigin={{ horizontal: 'right', vertical: 'top' }}
  onItemTouchTap={this.onMenuTap}
>
  <MenuItem primaryText="Load more" onTouchTap={this.onPlaceHolderClick} />
  <MenuItem primaryText="Delete all" onTouchTap={this.onDeleteAllClick} />
</IconMenu>

// ...

<div onClick={this.onPlaceHolderClick}>Load more</div>

// ...

<input
  onChange={this._handleFileSelect}
  ref={input => this.input = input}
  style={{ display: 'none' }}
  type="file"
  multiple={multi}
/>

每次都会调用onPlaceHolderClick，但如果是IconMenu，则什么都不会发生。控制台为空。

Answer 1

通过单击“加载更多”，您希望执行的操作是什么？

您确实有权访问onPlaceHolderClick中的clickEvent

onPlaceHolderClick = (event) => {
    console.log(event.target.value);
};

但是也许你想在"Load More“元素中启动一个http请求呢？