语义 ui 使内容 div 可滚动但不是整个页面可滚动？（流星+反应）

Question

我想实现这样的目标，我之前在这里搜索过：

jsfiddle.net/psychomachine/03pfvhzs/1/

但是我的申请结果是这样的：

http://i.imgur.com/S4wbKp9.png

这是正在呈现的代码：

//App.js
render() {
return <div className="main2">
  {/*HEADER (NAVIGATION + CONTEXT BAR)*/}
  <Navigation />
  {/*CONTENT*/}
  <div className="pusher">{ this.props.children }</div>
</div>;
},

内容 div 中的示例代码，即 "pusher"

<div className="ui main text container">
  <h3>Page Two</h3>
  <h3>Page Two</h3>
  <h3>Page Two</h3>
  <h3>Page Two</h3>
  <h3>Page Two</h3>
  <h3>Page Two</h3>
  <h3>Page Two</h3>
  <h3>Page Two</h3>
  <h3>Page Two</h3>
  <h3>Page Two</h3>
  <h3>Page Two</h3>
..... // This goes on for another 20 times, just to get scrolling to show
</div>

菜单栏的 div 呈现在 :

<div className="ui top attached demo inverted menu">
Rest of the code is at: http://semantic-ui.com/examples/fixed.html
If you view the page source, since it will be too cluttered to put in here

由于 React 的渲染方式，是否无法在 React 中执行？

这真的让我很烦恼，但如果做不到，哦，好吧，我不得不忍受页面不一致，因为没有滚动内容的页面不会有栏，而有的页面会有将所有内容向左推一点的滚动条

Answer 1

它与 Meteor 或 React 无关，你只需要将你的推送器包装在一个可推送的标签中 class，就像这样。

<div class="ui bottom attached segment pushable">
  <div class="pusher">
    <div class="ui main text container">
      <h3>Page Two</h3>
      <h3>Page Two</h3>
      <h3>Page Two</h3>
      <h3>Page Two</h3>
      <h3>Page Two</h3>
      <h3>Page Two</h3>
      <h3>Page Two</h3>
      <h3>Page Two</h3>
      <h3>Page Two</h3>
      <h3>Page Two</h3>
    </div>
  </div>
 </div>

Answer 2

你只需要将它包装在一个可推的class:

 <div class="ui top attached demo inverted menu">
  <div class="pusher">
    <div class="ui main text container">
      <h3>Page Two</h3>
      <h3>Page Two</h3>
      <h3>....</h3>
    </div>
  </div>
 </div>

语义 ui 使内容 div 可滚动但不是整个页面可滚动？（流星+反应）

semantic ui make content div scrollable but not the whole page scrollable? (meteor + react)

html

meteor

reactjs

semantic-ui

语义 ui 使内容 div 可滚动但不是整个页面可滚动？ （流星+反应）

semantic ui make content div scrollable but not the whole page scrollable? (meteor + react)

html

meteor

reactjs

semantic-ui

语义 ui 使内容 div 可滚动但不是整个页面可滚动？（流星+反应）