如何正确插入 Reactjs 滚动条模块

Question

我正在使用简单的 Facebook flux-chat example and plugging in nicer scroll bars for the "MessagesSection" 组件

滚动条的插件是here

我安装了模块，在 "MessagesSection" 中需要它，并将新组件包裹在消息列表中，如下所示：

render: function() {
    var postListItems = this.state.posts.map(getPostListItem);
    return (
      <div className="post-section">
        <h3 className="post-thread-heading">{this.state.thread.name}</h3>

        <ul className="post-list" ref="postList">
                <ScrollbarWrapper>
                  <div>             
                   {postListItems}
                  </div>
                </ScrollbarWrapper>
        </ul>

        <PostComposer threadID={this.state.thread.id}/>
      </div>
    );
  }

**注意：我也尝试将其包装在无序列表中。

但滚动条保持不变（仍然是以前的基本chrome）。

我做错了什么滚动条没有改变？

Answer 1

将此 CSS 复制粘贴到 index.html 中：https://github.com/ojame/react-scrollbars/blob/master/examples/views/home/examples/custom-scrollbar.css

然后像这样在包装器上使用 class：<ScrollbarWrapper className="ScrollbarContent--custom">

如何正确插入 Reactjs 滚动条模块

How to correctly plugin in a Reactjs Scroll bar module

javascript

plugins

facebook

scrollbar

reactjs