正文
关于element ui滚动条使用
提示：扫一扫查出行【扫一扫了解最新限行尾号】
复制提示
element ui 自带的滚动条使用
在容器的直接外层添加 （需要展现滚动条的那一级）
<el-scrollbar style="height:100%"></el-scrollbar>
如果
注意添加样式 height:100%
另外添加全局的样式
body .el-scrollbar__wrap {
overflow-x: hidden;
}
实例：
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<!-- import CSS -->
<link rel="stylesheet" href="https://unpkg.com/element-ui/lib/theme-chalk/index.css"> <style>
.el-scrollbar__wrap{
overflow-x: hidden;
}
</style>
</head>
<body>
<div id="app">
<div style="height:400px;">
<el-scrollbar style="height:100%">
<div style="width:700px;height:700px;border:solid;" >
....... blabla.....
</div>
</el-scrollbar>
</div>
</div>
</body>
<!-- import Vue before Element -->
<script src="https://unpkg.com/vue/dist/vue.js"></script>
<!-- import JavaScript -->
<script src="https://unpkg.com/element-ui/lib/index.js"></script>
<script>
new Vue({
el: '#app',
data: function() {
return { visible: false }
}
})
</script>
</html>
