我们可以用select2实现树视图吗？

Question

我将使用select2插件实现树视图。我尝试过基本的配置。你能帮帮我吗？ 期望的结果

这是我试过的代码

$('.js-example-basic-single').select2({
  placeholder: 'Select an option'
});

select {
    width: 100%;
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/js/select2.min.js"></script>
<link href='https://cdnjs.cloudflare.com/ajax/libs/select2/4.0.5/css/select2.min.css'>
<select name="" id="" class="js-example-basic-single">
    <option value="main">Pepal Inc.</option>
    <option value="child1">Business Unit 1</option>
    <option value="child1">Sub Business Unit 1</option>
    <option value="child-level1">Sub Sub Business Unit 1</option> 
    <option value="child-level1">Business Unit 2</option>
    <option value="child-level1">Business Unit 3</option>
    <option value="child1">Sub Business Unit 3</option>
    <option value="child-level1">Sub Sub Business Unit 3</option> 
</select>

Answer 1

是的，

  

你只需要尝试使用optgroup选项的select2，希望它能解决   你的问题。

工作示例代码：

select2 with optgroup

select2 with optgroup

Answer 2

是的，这里有一个真正的“ TREE”插件： https://github.com/clivezhg/select2-to-tree

兼容：Select2 4 +