一个div容器，如果设定了高度值，里面内容的高度超过了div容器则内容会溢出，效果如下：
如果给该div容器设定了overflow: auto; 则当内容超过div时会默认出现滚动条，如果内容没有超过，滚动条不显示：
滚动条的样式可以通过css属性来修改，这个下次再说，这里想强调的是，当一个容器在页面的某一个固定位置，而里面的元素有很多时，需要给这个容器加滚动条，但笔主在工作时遇到个小坑，这个容器需要给定一个具体的高度值才可以出现滚动条，但这个容器如果作为一个React组件，被其他组件调用时，这个高度值是不固定的，所以需要它的父级组件给它传递一个props，但正常情况下，子组件的高度父组件也不知道，这时候，传递的这个props可以是页面的高度（100vh）减去页面其他元素的高度值，举例：
页面有一个头部还有内容区，内容区是需要滚动条的，所以父级组件可以传递一个头部组件的高度值给内容区组件，这个内容区的高度可以设定：
<Content style={{height: 100vh - this.props.headerHeight;}} />
复制代码完美实现要求:)
已为社区贡献276条内容
所有评论(0)