可嵌套/Nestable
最后更新于:2022-04-01 22:23:47
# 可嵌套/Nestable
创建可以通过拖拽排序的可嵌套式列表。
可嵌套组件允许你通过拖拽排序条目。这是非常有用的,比如在管理界面中希望组织不同的分类或者菜单条目时。
* * *
## 用法
可嵌套列表由列表本身、它的内容条目和可嵌套的面板组成。注意 使用此组件需要额外添加 `nestable.css` 文件,在`css/components`文件夹中。此组件需要额外添加 `nestable.js` 文件,在`js/components`文件夹中。
| class和data属性 | 描述 |
| --- | --- |
| `.uk-nestable` | 添加此类名到 `<ul>` 元素,定义可嵌套组件。 |
| `.uk-nestable-item` | 添加此类名到列表的每一个 `<li>` 元素。 |
| `.uk-nestable-panel` | 添加此类名到 `<li>` 元素内部的 `<div>` 元素,给条目设定样式。 |
NOTE 为了使必要的JavaScript生效,需要添加 `data-uk-nestable` 属性。
### Example
![](https://docs.gechiui.com/gc-content/uploads/sites/kancloud/2016-05-12_57346f4098182.jpg)
### Markup
```
';
-
...
-
...
-
...
- ...
- ...
- ...