Material-UI 列表项在 AppBar 顶部滚动

Question

我正在使用 React.JS 的 Material-UI (http://material-ui.com) 来制作移动应用程序。列表项在应用栏顶部滚动其内容时遇到问题。其他内容（例如 中的普通段落文本）滚动良好。

这张图显示了滚动内容是如何到达应用栏顶部的：

虽然这些图片显示了一些添加的普通文本（来源如下），但滚动效果很好：

“一些文本”元素在 AppBar 下正确滚动：

“普通”文本（即不是从 ListItem 属性生成的文本）滚动良好：

这是主列表渲染代码：

renderConcerts() {
    return this.props.search.list.map((concert) => {
        return (
            <ListItem key={concert.id}
              primaryText={concert.work}
              secondaryText={concert.composer}
            />
        )
    });
}
renderContent() {
    console.log("renderContent ", this.props.search.classifier);
    const style = {
        margin: 12,
    };
    ....

    return <div id="mypaper">
      <p>Some text1</p>
      <Paper style={style}>
        <p>Some text2</p>
        <div className="content">
          <p>Some text3</p>
          <List>
            {this.renderConcerts()}
          </List>
        </div>
      </Paper>
    </div>;
}

render() {
    console.log("render");
    return (
        <div>
            <ResultHeader/>
            {this.renderContent()}
        </div>
    );
}

ResultHeader 组件：

export const ResultHeader = (props) =>
    <header>
        <AppBar
            title="Results"
            onLeftIconButtonTouchTap={hashHistory.goBack}
            iconElementLeft={<IconButton><ArrowBack /></IconButton>}
        />
    </header>;

样式：

#mypaper {
    width: 100%;
    margin: 0 auto;
    padding: 60px 0;
    overflow: auto; !important;
}
.content {
    margin: 10px;
    padding-bottom: 26pt;
    font-size: 12px;
    text-align: left;
}
.content table, .season tbody {
    border: none;
    font-size: 12px ;
}
.content h2 {
    font-size: x-large;
    color: #19768F;
    margin-top: 10px;
    margin-bottom: 3px;
}
.content h3 {
    font-size: 14px ;
    font-style: normal;
    font-weight: bold;
    margin-top: 10px;
    margin-bottom: 2px;
    color: #313C3F;
}

更新：我尝试将 z-index: 100 添加到 AppBar，但没有任何帮助：

此外，将 List 替换为 Table 提供了几乎相同的行为，即某些内容（标题和选择框）位于 AppBar 上方，而其他内容则在其下方很好地滚动：

Answer 1

添加z-index: 100或更多，如果您需要AppBar。