element ui懒加载
时间: 2023-08-29 08:13:47 浏览: 90
element树形控件懒加载的动态加载
ElementUI支持懒加载,可以通过`lazy`属性来实现。在`el-menu`、`el-tabs`等组件中,将`lazy`属性设置为`true`,可以实现懒加载。当页面渲染时,只会渲染当前可见的内容,其余的内容在需要时才会被加载。这可以减少页面加载时间和提高性能。
例如,在`el-tabs`中使用懒加载可以这样实现:
```html
<el-tabs v-model="activeName" lazy>
<el-tab-pane label="Tab 1" name="tab1">
<p>Content of Tab Pane 1</p>
</el-tab-pane>
<el-tab-pane label="Tab 2" name="tab2">
<!-- 这里的内容将在需要时才会被加载 -->
</el-tab-pane>
<el-tab-pane label="Tab 3" name="tab3">
<!-- 这里的内容将在需要时才会被加载 -->
</el-tab-pane>
</el-tabs>
```
其中,`lazy`属性设置为`true`,只有当前激活的标签页的内容才会被渲染,其他标签页的内容只有在需要时才会被加载。
阅读全文