Element Plus 相关

简介: Element Plus 相关

1.drawer里不能滚动 解决方案:

<el-drawer
      v-model="warehouseDrawer"
      custom-class="warehouse-drawer-wraper"
      title="已入库货品"
      size="640"
      :append-to-body="true"
    >
    <div class="fill">
      <DrawerWarehouse></DrawerWarehouse>
    <div>
</el-drawer>



//css
.fill {
  display: flex;
  flex-direction: column;
  height: 100%;
  overflow: hidden;
}
.warehouse-drawer-wraper {
  .el-drawer {
    outline: none;

    &__body {
      height: 100%;
      overflow: hidden;
    }
  }
}

2.el-scrollbar组件判断滚动到底部 执行加载更多

<div class="scroll-view">
  <el-scrollbar @scroll="onScroll">
    <div class="scroll-body">
       <template v-for="(item, index) in resList" :key="item.id">
         
       </template>
    </div>
  </el-scrollbar>
</div>


const onScroll = (e) => {
  const el = document.getElementsByClassName('scroll-body')[0];
  const elView = document.getElementsByClassName('scroll-view')[0];
  if (el && elView) {
    const windowHeight = elView.clientHeight;
    const scrollTop = e.scrollTop;
    const bodyScrollHeight = el.scrollHeight;
    if (scrollTop + windowHeight >= bodyScrollHeight - 5) {
      loadMore();
    }
  }
};

后续会持续更新

目录
相关文章
|
6月前
|
JavaScript 前端开发 API
document 对象
document对象是JavaScript中最重要的对象之一,它表示当前页面的HTML文档。document对象提供了丰富的属性和方法,允许我们访问、操作和修改HTML文档的结构和内容。
55 3
|
6月前
|
存储 算法 对象存储
【C++11算法】minmax和minmax_element
【C++11算法】minmax和minmax_element
144 0
element-ui本地使用
element-ui本地使用
106 0
|
XML JavaScript 前端开发
你真的知道DOM吗(中)----(Document类型, Element类型)
你真的知道DOM吗(中)----(Document类型, Element类型)
98 0
|
JavaScript
element部分技巧总结
而v-if用来切换的元素是会被销毁的,导致了v-if内的表单项,由于在mounted时期没有进行渲染,所以规则也没有绑定上。初始化时不符合显示条件的不会生成规则,导致后面切换条件,显示的输入框的校验不会生效
|
存储 移动开发 缓存
Day23 - document以外的常用对象
Day23 - document以外的常用对象
114 0
|
Web App开发 JavaScript iOS开发
|
算法 C#
算法题丨Remove Element
描述 Given an array and a value, remove all instances of that value in-place and return the new length.
1044 0
|
JavaScript 前端开发