创建树形视图下拉列表

要创建树形视图下拉列表，你可以使用HTML、CSS和JavaScript来实现。下面是一个简单的示例代码：

HTML代码：

<div class="dropdown">
  <button class="dropbtn">选择项目</button>
  <div class="dropdown-content">
    <input type="checkbox" id="item1">
    <label for="item1">项目1</label>
    <input type="checkbox" id="item2">
    <label for="item2">项目2</label>
    <div class="dropdown-submenu">
      <input type="checkbox" id="item3">
      <label for="item3">项目3</label>
      <input type="checkbox" id="item4">
      <label for="item4">项目4</label>
    </div>
  </div>
</div>

CSS代码：

.dropdown {
  position: relative;
  display: inline-block;
}

.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
}

.dropdown-content input[type="checkbox"] {
  margin: 5px;
}

.dropdown-submenu {
  margin-left: 20px;
}

.show {
  display: block;
}

JavaScript代码：

document.querySelector(".dropbtn").addEventListener("click", function() {
  document.querySelector(".dropdown-content").classList.toggle("show");
});

var subMenu = document.querySelector(".dropdown-submenu");
var checkBox = document.getElementById("item3");

checkBox.addEventListener("change", function() {
  if (this.checked) {
    subMenu.classList.add("show");
  } else {
    subMenu.classList.remove("show");
  }
});

这段代码创建了一个树形视图下拉列表，其中有三个项目：项目1、项目2和项目3。当点击"选择项目"按钮时，下拉列表将显示出来，并且可以选择项目。当选择项目3时，会显示项目3的子菜单项目4。

请注意，这只是一个简单的示例，你可以根据自己的实际需求进行修改和扩展。